1

在仅在 Google Chrome 上重新加载页面之前，我无法绘制我的 HTML5 画布，它在 Firefox 上运行良好。

这是一个小提琴：http: //jsfiddle.net/c5mGL/

<canvas id="myCanvas" width="1202" height="602" style="border:1px solid #d3d3d3;"></canvas>

(function () {
'use strict';

window.onload = function () {
  var canvas = document.getElementById("myCanvas");
  var ctx = canvas.getContext("2d");

  function reset() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    ctx.beginPath();
    ctx.moveTo(100, 150);
    ctx.lineTo(450, 50);
    ctx.stroke();
  }

  reset();
};
})();

在小提琴中显示时一切正常，因为 HTML 网页嵌入在 iframe 中。但是如果你直接看生成的网页http://jsfiddle.net/c5mGL/5/show/，就会出现问题。

复制步骤：打开谷歌浏览器，打开一个新标签，转到http://jsfiddle.net/c5mGL/5/show/，按回车，你什么也看不到（JavaScript 控制台也没有错误）。现在刷新选项卡，您会在画布中看到该行。

看起来是因为 HTML5 画布的大小，因为如果您使用较小的画布（300 * 200），它工作得很好。

任何人的想法？

非常感谢。

编辑：谷歌浏览器版本：版本 28.0.1500.72 m

4

1 回答 1

1

根据评论：

这可能是驱动程序问题。尝试禁用 Canvas 硬件加速，chrome://flags/ 并将频道切换到 Dev 频道，看看问题是否已经解决。

于 2013-07-30T09:20:46.950 回答