将图像从localhost绘制到chrome中的画布上

Question

我正在访问localhost中的文件夹中的图像。

图像在img标记中正确加载。但是，当我尝试将该图像绘制到画布上时，它不会出现！

我已经实现了它，当图像被放到画布上时，它被绘制到它上面，我通过从原始源获取图像来绘制它。当我一次又一次地拖动时，经过一些尝试，它会出现。

该功能在Firefox和I.E中完美运行。

这是我在localhost上的图片来源：

b.src = "http://localhost/casema...E/2780Chrysanthemum.jpg"

ctx1.drawImage(b, x2-15*z, y2-15*z, w1, h1 );

Answer 1

在HTML5中，无法确定图像是否会立即加载，所以您 需要确保图像已经完全加载beford你绘制它。这段代码可以帮到你：

var myImage = new Image();
myImage.src = "path/to/your/image";
myImage.onload = function(){
      //context is the canvas context 
      context.drawImage(myImage,x,y,weight,height);
}

Answer 2

您是否在计算机上使用本地HTML文件？如果是这样，您需要添加参数

- 允许文件存取从-文件

致电Chrome时。