1

我很难用 Canvas 绘制流畅的线条，但仅限于 Safari 和 Firefox。Chrome 绘制流畅。在 Safari 中看起来像这样：

截图 http://jacobharris.org/screenshot.jpg

这是我的 JavaScript：

function Draw(x, y, isDown) {
    if (isDown) {
        ctx.beginPath();
        ctx.strokeStyle = color_selected;
        ctx.globalCompositeOperation = "source-over";
        ctx.lineWidth = 15;
        ctx.lineJoin = "round";
        ctx.lineCap = "round";
        if (lastX == 0 && lastY ==0){
            ctx.moveTo(x, y);
        }else{
            ctx.moveTo(lastX, lastY);
        }
        ctx.lineTo(x, y);
        ctx.closePath();
        ctx.stroke();
    }
    lastX = x; lastY = y;
}}

我确保为 lineJoin 和 lineCap 选择“圆形”。不知道我还需要改变什么。

4

1 回答 1

0

删除这一行：

ctx.closePath();

它应该可以工作。

无需调用closePath()单行，因为您只会在其上创建重叠实例。Safari 似乎无法很好地处理这个问题（依赖于实现，但猜测是它设置位的方式 - 低级方式；在同一路径实例中有重叠的地方，它似乎会被异或'ed 光栅化）。

在这里修改修改后的代码

于 2013-09-20T22:41:21.840 回答