画布画线太厚

Question

我想在每48px高的画布元素上画线。这里是我的代码（包括一个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; 

我的经历是，我的第一行很脆，1px高。我所有的其他线路都更高。这里的结果：

result http://ghentgators.be/test/canvas_line_heightnotcorrect.JPG

Answer 1

更改初始Y至+0.5（或-0.5），你会得到很好的线。