From c1949a28f0f04fa742cde95868221156ebcdd938 Mon Sep 17 00:00:00 2001
From: philip <philip@bitsighttech.com>
Date: Sun, 17 May 2020 00:13:40 +0000
Subject: [PATCH 1/2] Just draw everything on pixel boundaries. Browsers just
 get the difficult cases wrong.

---
 src/ol/reproj.js | 36 +++++++++++++++---------------------
 1 file changed, 15 insertions(+), 21 deletions(-)

diff --git a/src/ol/reproj.js b/src/ol/reproj.js
index da0b2b56d0..9028e83416 100644
--- a/src/ol/reproj.js
+++ b/src/ol/reproj.js
@@ -298,12 +298,13 @@ export function render(
       y1 = source[1][1];
     let x2 = source[2][0],
       y2 = source[2][1];
-    const u0 = (target[0][0] - targetTopLeft[0]) / targetResolution;
-    const v0 = -(target[0][1] - targetTopLeft[1]) / targetResolution;
-    const u1 = (target[1][0] - targetTopLeft[0]) / targetResolution;
-    const v1 = -(target[1][1] - targetTopLeft[1]) / targetResolution;
-    const u2 = (target[2][0] - targetTopLeft[0]) / targetResolution;
-    const v2 = -(target[2][1] - targetTopLeft[1]) / targetResolution;
+    // Make sure that everything is on pixel boundaries
+    const u0 = pixelRound((target[0][0] - targetTopLeft[0]) / targetResolution);
+    const v0 = pixelRound(-(target[0][1] - targetTopLeft[1]) / targetResolution);
+    const u1 = pixelRound((target[1][0] - targetTopLeft[0]) / targetResolution);
+    const v1 = pixelRound(-(target[1][1] - targetTopLeft[1]) / targetResolution);
+    const u2 = pixelRound((target[2][0] - targetTopLeft[0]) / targetResolution);
+    const v2 = pixelRound(-(target[2][1] - targetTopLeft[1]) / targetResolution);
 
     // Shift all the source points to improve numerical stability
     // of all the subsequent calculations. The [x0, y0] is used here.
@@ -335,35 +336,28 @@ export function render(
       isBrokenDiagonalRendering() ||
       opt_contextOptions === IMAGE_SMOOTHING_DISABLED
     ) {
-      // Make sure that everything is on pixel boundaries
-      const u0r = pixelRound(u0);
-      const v0r = pixelRound(v0);
-      const u1r = pixelRound(u1);
-      const v1r = pixelRound(v1);
-      const u2r = pixelRound(u2);
-      const v2r = pixelRound(v2);
       // Make sure that all lines are horizontal or vertical
-      context.moveTo(u1r, v1r);
+      context.moveTo(u1, v1);
       // This is the diagonal line. Do it in 4 steps
       const steps = 4;
-      const ud = u0r - u1r;
-      const vd = v0r - v1r;
+      const ud = u0 - u1;
+      const vd = v0 - v1;
       for (let step = 0; step < steps; step++) {
         // Go horizontally
         context.lineTo(
-          u1r + pixelRound(((step + 1) * ud) / steps),
-          v1r + pixelRound((step * vd) / (steps - 1))
+          u1 + pixelRound(((step + 1) * ud) / steps),
+          v1 + pixelRound((step * vd) / (steps - 1))
         );
         // Go vertically
         if (step != steps - 1) {
           context.lineTo(
-            u1r + pixelRound(((step + 1) * ud) / steps),
-            v1r + pixelRound(((step + 1) * vd) / (steps - 1))
+            u1 + pixelRound(((step + 1) * ud) / steps),
+            v1 + pixelRound(((step + 1) * vd) / (steps - 1))
           );
         }
       }
       // We are almost at u0r, v0r
-      context.lineTo(u2r, v2r);
+      context.lineTo(u2, v2);
     } else {
       context.moveTo(u1, v1);
       context.lineTo(u0, v0);

From 92a47b5e578259ea8ba967141e763a3483767db8 Mon Sep 17 00:00:00 2001
From: Andreas Hocevar <andreas.hocevar@gmail.com>
Date: Sun, 17 May 2020 15:35:28 +0200
Subject: [PATCH 2/2] Make formatting prettier

---
 src/ol/reproj.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/ol/reproj.js b/src/ol/reproj.js
index 9028e83416..6606b079d3 100644
--- a/src/ol/reproj.js
+++ b/src/ol/reproj.js
@@ -300,11 +300,17 @@ export function render(
       y2 = source[2][1];
     // Make sure that everything is on pixel boundaries
     const u0 = pixelRound((target[0][0] - targetTopLeft[0]) / targetResolution);
-    const v0 = pixelRound(-(target[0][1] - targetTopLeft[1]) / targetResolution);
+    const v0 = pixelRound(
+      -(target[0][1] - targetTopLeft[1]) / targetResolution
+    );
     const u1 = pixelRound((target[1][0] - targetTopLeft[0]) / targetResolution);
-    const v1 = pixelRound(-(target[1][1] - targetTopLeft[1]) / targetResolution);
+    const v1 = pixelRound(
+      -(target[1][1] - targetTopLeft[1]) / targetResolution
+    );
     const u2 = pixelRound((target[2][0] - targetTopLeft[0]) / targetResolution);
-    const v2 = pixelRound(-(target[2][1] - targetTopLeft[1]) / targetResolution);
+    const v2 = pixelRound(
+      -(target[2][1] - targetTopLeft[1]) / targetResolution
+    );
 
     // Shift all the source points to improve numerical stability
     // of all the subsequent calculations. The [x0, y0] is used here.