《WebBrowser》——— 终于支持canvas.drawImage 及网上坑爹的使用教程

网上一般用canvas 显示照片的代码是这样写的

 

            var canvas = document.getElementById(id);
            if (canvas == null)
            { 
                return false; 
            }
            var context = canvas.getContext('2d');
            image = new Image();
            image.src = "aa.gif";

            context.drawImage(image, 0, 0);

 

我不知道那些人是怎么有没有试用,这么写代码十有89图片是出不来的

因为即使图片再小,也要加载时间,在图片没有加载完成就drawImage的话,是画不出图片的

这种写法,只有先用个<img>把图片下下来,再drawImage才能实现

所以正确的写法是

            image.onload = function () 
            { 
                drawImg(context, image); 
            }
            function drawImg(context, image)
            {
                context.drawImage(image, 0, 0);
            }

这时我们就可以复重使用context.drawImage来画图,也可以重复使用image.onload()方法来重新加载图片

转自：http://blog.csdn.net/zb219/article/details/7570022