如何判断HTML画布中是否已经绘制了图像

Question

假设我有一个图像siteimage1.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.");
}