Холст рисует слишком толстые линии - PullRequest
1 голос
/ 25 сентября 2011

Я хочу рисовать линии на моем элементе холста на каждой высоте 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. Все остальные мои строки выше. Вот результат:

результат http://ghentgators.be/test/canvas_line_heightnotcorrect.JPG

1 Ответ

4 голосов
/ 25 сентября 2011

Измените исходное значение Y на +0,5 (или -0,5), и вы получите хорошие строки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...