畫布畫線太厚

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），你會得到很好的線。