Question

我只能在Google Chrome重新加载页面之前绘制我的HTML5画布，它在Firefox上运行正常。

<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），它可以很好地工作。

有谁的想法？

非常感谢。

修改：Google Chrome版本：版本28.0.1500.72 m

Answer 1

根据评论：

这可能是司机问题。尝试禁用Canvas硬件加速，chrome：// flags / AND切换到Dev通道的通道，看看问题是否已经修复。

在页面重新加载之前无法绘制我的HTML5画布（仅限Google Chrome）

1 个答案: