diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index deb33c568d..d991814d4f 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -5097,8 +5097,11 @@ class App extends React.Component { 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 index 8d5642f859..0855a70d85 100644 --- 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,