如何确定图像是否已经在 HTML Canvas 中绘制

Question

假设我有一个图像 /site/image1.jpg 在将其绘制到画布上时会是这样的。

var image = new Image();
image.src = "/site/image1.jpg";
image.onload = function(){
    context.drawImage(image,x,y);
}

假设我的互联网连接速度很慢，我怎么知道图像已经在画布上绘制？

谢谢。

Answer 1

如果图像已被绘制，则要锻炼保持旗帜或标记图像。

var image = new Image();
image.src = "blah.foo";
image.drawn = false;  // Add a property to indicate if the image has been drawn
image.onload = function(){
    ctx.drawImage(image,0,0);
    image.drawn = true;  // flag it as drawn
}
// then later you if you want to know if its been drawn
if(image.drawn){
    console.log("Yes its been drawn.");
}