3

我对画布和 Chrome 27.0 有一个奇怪的问题：

在画布上大量绘制后，使用 arc 函数在 OS X 上的 Chrome 中绘制实心方块，但在同一 OS X 机器上的 Safari、Firefox 中运行良好，在 Windows 上的 IE10、Chrome 和 Firefox 中一直很好.

如果不事先运行大量代码，这个问题就无法重现，所以我假设它与事先正在做的事情有关，但这里有一些信息，也许有人可以指出我没有想到的方向然而。

这是失败的代码：

    ctx.beginPath();
    ctx.strokeStyle = "rgba(255, 255, 255, 0.9)";
    ctx.arc(cx*sfx, cy*sfy, width*sfy, 0, Math.PI * 2, false);
    ctx.closePath();
    ctx.stroke();

我可以通过不在 2pi 上做弧，而是在 1.9999pi 上绘制圆弧。此代码有效：

    ctx.beginPath();
    ctx.strokeStyle = "rgba(255, 255, 255, 0.9)";
    ctx.arc(cx*sfx, cy*sfy, width*sfy, 0, Math.PI * 1.999, false);
    ctx.closePath();
    ctx.stroke();

同样有效的是删除 beginPath() 语句。但是，从画布上最后一个对象绘制的位置到圆的起点绘制一条线。

我已经尝试重新排序，删除加倍的开始/结束路径语句，除了描述的之外，所有这些都没有效果。

任何线索任何人？

干杯

  • 巴尔特
4

1 回答 1

0

有同样的问题，我一开始使用了同样的技巧，但后来我添加了一个 moveTo

  ctx.moveTo(x + radius, y);
  ctx.arc(x, y, radius, 0, Math.PI*2, true);

  /*
  Chrome suddenly started drawing a filled square (2013 May 26)
  can't get the filled square though in jsfiddle

  first try was changing it to
  ctx.arc(x, y, radius, 0, Math.PI*1.999, false)
  which worked, but then added the moveTo, which also made it work again
  */
于 2013-11-13T18:07:23.303 回答