From d88b2b4df4ff9a7f88b4e3309d09b70acdbbfc8b Mon Sep 17 00:00:00 2001 From: "Michael \"Z\" Goddard" Date: Wed, 8 Aug 2018 14:05:30 -0400 Subject: [PATCH] offset pen lines of width 1 and 3 (#314) --- src/PenSkin.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/PenSkin.js b/src/PenSkin.js index 69791bb..de2bdcd 100644 --- a/src/PenSkin.js +++ b/src/PenSkin.js @@ -132,9 +132,13 @@ class PenSkin extends Skin { drawLine (penAttributes, x0, y0, x1, y1) { const ctx = this._canvas.getContext('2d'); this._setAttributes(ctx, penAttributes); + + // Width 1 and 3 lines need to be offset by 0.5. + const diameter = penAttributes.diameter || DefaultPenAttributes.diameter; + const offset = (Math.max(4 - diameter, 0) % 2) / 2; ctx.beginPath(); - ctx.moveTo(this._rotationCenter[0] + x0, this._rotationCenter[1] - y0); - ctx.lineTo(this._rotationCenter[0] + x1, this._rotationCenter[1] - y1); + ctx.moveTo(this._rotationCenter[0] + x0 + offset, this._rotationCenter[1] - y0 + offset); + ctx.lineTo(this._rotationCenter[0] + x1 + offset, this._rotationCenter[1] - y1 + offset); ctx.stroke(); this._canvasDirty = true; this._silhouetteDirty = true;