如何从另一个域加载img src for canvas？

Question

当我在画布中加载图像并指定其src时，我使用的文件名与html文件位于同一文件夹中，并加载img。所以它会是这样的：

img.src = 'Untitled.png'; 

但是如果我试试这个，img就不会加载

img.src = 'http://dgroover.wikispaces.com/file/view/bill-gates-car.jpg'; 

有谁知道什么是错的？

Answer 1

使用此代码：

标记部分

<canvas id="cnv" width="500" height="500"></canvas>

脚本部分

var img = new Image();
img.onload = function(){
    document.getElementById("cnv").getContext("2d").drawImage(this,0,0);
};
img.src="http://dgroover.wikispaces.com/file/view/bill-gates-car.jpg";​

DEMO

Answer 2

以这种方式尝试：

> var canvas = document.getElementById("myCanvas");
>         var ctx = canvas.getContext("2d");      
>         ctx.translate(0.5, 0.5);
>         ctx.strokeStyle = "#5F7FA2";
>         ctx.strokeRect(50, 50, 25, 25);
>         var img = new Image();
>         img.src = "http://www.cs.washington.edu/education/courses/csep576/05wi/projects/project4/web/artifact/liebling/average_face.gif";
>         img.onload = function(){
>         ctx.drawImage(img, 50, 50);}