Chrome中的锯齿状画布渲染

Question

我正在使用HTML画布编写绘图应用程序。为了平滑绘制的线条，我在每个mousemove事件后填充一系列二次曲线：

    ctx.beginPath()
    ctx.moveTo(mx1-halfLastWidth*sin(angle), my1-halfLastWidth*cos(angle))
    ctx.quadraticCurveTo(mx1-lastWidth*cos(angle), my1+lastWidth*sin(angle),
      mx1+halfLastWidth*sin(angle), my1+halfLastWidth*cos(angle))
    ctx.quadraticCurveTo(xl+halfMidWidth*sin(angle), yl+halfMidWidth*cos(angle),
      mx2+halfCurrentWidth*sin(angle), my2+halfCurrentWidth*cos(angle))
    ctx.quadraticCurveTo(mx2+currentWidth*cos(angle), my2-currentWidth*sin(angle),
      mx2-halfCurrentWidth*sin(angle), my2-halfCurrentWidth*cos(angle))
    ctx.quadraticCurveTo(xl-halfMidWidth*sin(angle), yl-halfMidWidth*cos(angle),
      mx1-halfLastWidth*sin(angle), my1-halfLastWidth*cos(angle))
    ctx.fill()

完整演示：http://jsfiddle.net/PfzM2/2/（由于这是从更大的项目中提取的，因此有很多不相关的代码）

这些线条在Firefox中渲染非常流畅，但在Chrome中的位置似乎“锯齿状”：

发给浏览器的一系列命令和参数是相同的。

如何让Chrome渲染像Firefox这样的行？

Answer 1

在字体渲染方面，各地都有类似的问题。它几乎肯定 可能是相同的根问题：渲染引擎​​产生的抗锯齿差异。如你所知，Chrome使用Webkit; FF，壁虎。 Gecko似乎比Webkit更喜欢抗锯齿。

将它归结为浏览器问题（我认为这种情况通常适用于IE）。

编辑：似乎反过来也是正确的。 Nick Heer在his blog中对此进行了讨论：“由于Gecko更精确（和更强大）的抗锯齿，大多数衬线面看起来都不太好。”可能是一个平台问题。