canvas的drawImage()绘图片不显示问题

<canvas id="myCanvas" width="200" height="100"></canvas>
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var img=new Image();
img.src="w3c.gif";
cxt.drawImage(img,0,0);

图片此时是不显示的,因为图片在没加载完的情况下用canvas绘制会失败,修改如下:

<canvas id="myCanvas" width="200" height="100"></canvas>
<img src="img/w3c.gif" hidden="hidden" id="img1">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var img=document.getElementById("img1");
img.onload=function(){cxt.drawImage(img,0,0);};

也可用定时器实现。
 

猜你喜欢

转载自blog.csdn.net/m0_38073011/article/details/80027397
今日推荐