캔버스가 너무 두꺼운 선을 그립니다.

Question

매주 48px 높이에서 캔버스 요소에 선을 그립니다. 여기에 내 코드 (작은 jquery selector는 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)로 변경

하고 멋진 라인을 얻을 수 있습니다.