fix: Two finger panning is slow (#7849)

Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
excalidraw · May 19, 2024 · be4e127 · be4e127
1 parent ff0b439
commit be4e127
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx
@@ -5097,8 +5097,11 @@ class App extends React.Component<AppProps, AppState> {
 
         this.translateCanvas({
           zoom: zoomState.zoom,
-          scrollX: zoomState.scrollX + deltaX / nextZoom,
-          scrollY: zoomState.scrollY + deltaY / nextZoom,
+          // 2x multiplier is just a magic number that makes this work correctly
+          // on touchscreen devices (note: if we get report that panning is slower/faster
+          // than actual movement, consider swapping with devicePixelRatio)
+          scrollX: zoomState.scrollX + 2 * (deltaX / nextZoom),
+          scrollY: zoomState.scrollY + 2 * (deltaY / nextZoom),
           shouldCacheIgnoreZoom: true,
         });
       });

diff --git a/packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap b/packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap
@@ -10752,7 +10752,7 @@ exports[`regression tests > pinch-to-zoom works > [end of test] appState 1`] = `
   "pendingImageElementId": null,
   "previousSelectedElementIds": {},
   "resizingElement": null,
-  "scrollX": -2.916666666666668,
+  "scrollX": -6.2500000000000036,
   "scrollY": 0,
   "scrolledOutside": false,
   "selectedElementIds": {},
@@ -13688,8 +13688,8 @@ exports[`regression tests > two-finger scroll works > [end of test] appState 1`]
   "pendingImageElementId": null,
   "previousSelectedElementIds": {},
   "resizingElement": null,
-  "scrollX": 10,
-  "scrollY": -10,
+  "scrollX": 20,
+  "scrollY": -18.535533905932738,
   "scrolledOutside": false,
   "selectedElementIds": {},
   "selectedElementsAreBeingDragged": false,