Chrome上Canvas drawImage类型错误

Question

我在最新的Chrome浏览器（在Windows 7上使用版本27）使用Canvas和drawImage时出现了一个奇怪的错误。该错误仅在Chrome上发生，在Firefox和IE上一切都正常。

我在这里创建了一个失败的简化测试案例：http://jsfiddle.net/qU3s5/

HTML

<canvas id="canvas"></canvas>

JavaScript

var canvas = document.getElementById("canvas");

var ctx = canvas.getContext("2d");

var img = new Image();
img.onload = function() {
  ctx.drawImage(this, 0, 0);
}
img.src = "http://octodex.github.com/images/foundingfather_v2.png";

这让我在调用drawImage的那行代码上出现了Uncaught TypeError: Type error。

- Simon Boudrias

---

那个 jsfiddle 对我有效...尝试将 ID 名称更改为更独特的名称。 - dchhetri

我想知道是否可以通过“about:flag”中的实验性Chrome功能来触发它... 在Windows 7上，这绝对不起作用。 - Simon Boudrias

Answer 1

在使用new Image()时，Chrome会抛出一个错误。相反，你需要使用以下代码:

var img = document.createElement('img');

更新的fiddle链接：http://jsfiddle.net/aM8aA/

下面是相关的Chromium项目bug报告：https://code.google.com/p/chromium/issues/detail?id=238071

- Simon Boudrias

---

+1 哇：有用的信息...但非常令人不安！最新版本的 Chrome 在处理画布方面似乎经常出现故障。 - markE

可能并不是Chrome出现了更多故障，而是有更多的人在使用它，因此发现了更多的故障。 - Tyler Scott