var c=document.getElementById("mycanvas");
var cxt=c.getContext("2d");
var img=new Image();
img.src='img/github-icon.png';
var cxt=c.getContext("2d");
var img=new Image();
img.src='img/github-icon.png';
cxt.drawImage(img,0,0);
w3c事例中给出的例子是以上内容,但是真正去运行的时候,发现图像并没有被绘制出来,如果直接创建一个img标签,然后添加到drawImage函数里面,则可以绘制成功,最后发现,没有绘制成功的原因是因为在绘制动作发生时,图片加载没有完成,所以需要稍微修改下代码
var c=document.getElementById("mycanvas");
var cxt=c.getContext("2d");
var img=new Image();
img.src='img/github-icon.png';
img.οnlοad=function(){
cxt.drawImage(img,0,0);
}
当图片加载完毕后,绘制