Fix pixel rounding

This commit is contained in:
philip
2020-01-11 17:26:52 +00:00
parent 902ed53999
commit 852f6552c7
+12 -8
View File
@@ -176,6 +176,10 @@ export function render(width, height, pixelRatio,
context.scale(pixelRatio, pixelRatio); context.scale(pixelRatio, pixelRatio);
function pixelRound(value) {
return Math.round(value * pixelRatio) / pixelRatio;
}
context.globalCompositeOperation = 'lighter'; context.globalCompositeOperation = 'lighter';
const sourceDataExtent = createEmpty(); const sourceDataExtent = createEmpty();
@@ -271,12 +275,12 @@ export function render(width, height, pixelRatio,
if (isBrokenDiagonalRendering()) { if (isBrokenDiagonalRendering()) {
// Make sure that everything is on pixel boundaries // Make sure that everything is on pixel boundaries
const u0r = Math.round(u0); const u0r = pixelRound(u0);
const v0r = Math.round(v0); const v0r = pixelRound(v0);
const u1r = Math.round(u1); const u1r = pixelRound(u1);
const v1r = Math.round(v1); const v1r = pixelRound(v1);
const u2r = Math.round(u2); const u2r = pixelRound(u2);
const v2r = Math.round(v2); const v2r = pixelRound(v2);
// Make sure that all lines are horizontal or vertical // Make sure that all lines are horizontal or vertical
context.moveTo(u1r, v1r); context.moveTo(u1r, v1r);
// This is the diagonal line. Do it in 4 steps // This is the diagonal line. Do it in 4 steps
@@ -285,10 +289,10 @@ export function render(width, height, pixelRatio,
const vd = v0r - v1r; const vd = v0r - v1r;
for (let step = 0; step < steps; step++) { for (let step = 0; step < steps; step++) {
// Go horizontally // Go horizontally
context.lineTo(u1r + Math.round((step + 1) * ud / steps), v1r + Math.round(step * vd / (steps - 1))); context.lineTo(u1r + pixelRound((step + 1) * ud / steps), v1r + pixelRound(step * vd / (steps - 1)));
// Go vertically // Go vertically
if (step != (steps - 1)) { if (step != (steps - 1)) {
context.lineTo(u1r + Math.round((step + 1) * ud / steps), v1r + Math.round((step + 1) * vd / (steps - 1))); context.lineTo(u1r + pixelRound((step + 1) * ud / steps), v1r + pixelRound((step + 1) * vd / (steps - 1)));
} }
} }
// We are almost at u0r, v0r // We are almost at u0r, v0r