画布画线太粗

Question

我想在我的画布元素上每隔 48 像素高画一条线。这是我的代码（包括一个小的 jquery 选择器，因为我也使用 jQuery）。

var $canvas = $('canvas')
        , maxY = $canvas.outerHeight()
        , maxX = $canvas.outerWidth()
        , X = 0
        , Y = 0
        , ctx = $canvas.get(0).getContext('2d');

    ctx.strokeStyle = "rgb(100,0,0)";
    ctx.lineWidth = 1.0;
    ctx.lineCap = "round";
    while (Y < maxY) {
        ctx.beginPath();
        ctx.moveTo(X, Y);
        ctx.lineTo(maxX, Y);
        //ctx.closePath();
        ctx.stroke();
        Y += 48;
    };

    Y = 0;

我的经验是我的第一行很清晰，高 1 像素。我所有的其他线都更高。结果如下：

_{（来源：ghentgators.be）}

Answer 1

将您最初的 Y 更改为 +0.5（或 -0.5），您会得到漂亮的线条。