fix: stop flooring scroll positions (#2883)

src/scene/export.ts

@@ -5,7 +5,6 @@ import { NonDeletedExcalidrawElement } from "../element/types";
 import { getCommonBounds } from "../element/bounds";
 import { renderScene, renderSceneToSvg } from "../renderer/renderScene";
 import { distance, SVG_NS } from "../utils";
-import { normalizeScroll } from "./scroll";
 import { AppState } from "../types";
 import { t } from "../i18n";
 import { DEFAULT_FONT_FAMILY, DEFAULT_VERTICAL_ALIGN } from "../constants";
@@ -59,8 +58,8 @@ export const exportToCanvas = (
     tempCanvas,
     {
       viewBackgroundColor: exportBackground ? viewBackgroundColor : null,
-      scrollX: normalizeScroll(-minX + exportPadding),
-      scrollY: normalizeScroll(-minY + exportPadding),
+      scrollX: -minX + exportPadding,
+      scrollY: -minY + exportPadding,
       zoom: getDefaultAppState().zoom,
       remotePointerViewportCoords: {},
       remoteSelectedElementIds: {},

src/scene/index.ts

@@ -6,7 +6,7 @@ export {
   getSelectedElements,
   getTargetElements,
 } from "./selection";
-export { normalizeScroll, calculateScrollCenter } from "./scroll";
+export { calculateScrollCenter } from "./scroll";
 export {
   hasBackground,
   hasStroke,

src/scene/scroll.ts

@@ -1,4 +1,4 @@
-import { AppState, FlooredNumber, PointerCoords, Zoom } from "../types";
+import { AppState, PointerCoords, Zoom } from "../types";
 import { ExcalidrawElement } from "../element/types";
 import { getCommonBounds, getClosestElementBounds } from "../element";
 
@@ -7,9 +7,6 @@ import {
   viewportCoordsToSceneCoords,
 } from "../utils";
 
-export const normalizeScroll = (pos: number) =>
-  Math.floor(pos) as FlooredNumber;
-
 const isOutsideViewPort = (
   appState: AppState,
   canvas: HTMLCanvasElement | null,
@@ -40,16 +37,14 @@ export const centerScrollOn = ({
   zoom: Zoom;
 }) => {
   return {
-    scrollX: normalizeScroll(
+    scrollX:
       (viewportDimensions.width / 2) * (1 / zoom.value) -
-        scenePoint.x -
-        zoom.translation.x * (1 / zoom.value),
-    ),
-    scrollY: normalizeScroll(
+      scenePoint.x -
+      zoom.translation.x * (1 / zoom.value),
+    scrollY:
       (viewportDimensions.height / 2) * (1 / zoom.value) -
-        scenePoint.y -
-        zoom.translation.y * (1 / zoom.value),
-    ),
+      scenePoint.y -
+      zoom.translation.y * (1 / zoom.value),
   };
 };
 
@@ -57,11 +52,11 @@ export const calculateScrollCenter = (
   elements: readonly ExcalidrawElement[],
   appState: AppState,
   canvas: HTMLCanvasElement | null,
-): { scrollX: FlooredNumber; scrollY: FlooredNumber } => {
+): { scrollX: number; scrollY: number } => {
   if (!elements.length) {
     return {
-      scrollX: normalizeScroll(0),
-      scrollY: normalizeScroll(0),
+      scrollX: 0,
+      scrollY: 0,
     };
   }
   let [x1, y1, x2, y2] = getCommonBounds(elements);

src/scene/scrollbars.ts

@@ -1,6 +1,6 @@
 import { ExcalidrawElement } from "../element/types";
 import { getCommonBounds } from "../element";
-import { FlooredNumber, Zoom } from "../types";
+import { Zoom } from "../types";
 import { ScrollBars } from "./types";
 import { getGlobalCSSVariable } from "../utils";
 import { getLanguage } from "../i18n";
@@ -18,8 +18,8 @@ export const getScrollBars = (
     scrollY,
     zoom,
   }: {
-    scrollX: FlooredNumber;
-    scrollY: FlooredNumber;
+    scrollX: number;
+    scrollY: number;
     zoom: Zoom;
   },
 ): ScrollBars => {

src/scene/types.ts

@@ -1,9 +1,9 @@
 import { ExcalidrawTextElement } from "../element/types";
-import { FlooredNumber, Zoom } from "../types";
+import { Zoom } from "../types";
 
 export type SceneState = {
-  scrollX: FlooredNumber;
-  scrollY: FlooredNumber;
+  scrollX: number;
+  scrollY: number;
   // null indicates transparent bg
   viewBackgroundColor: string | null;
   zoom: Zoom;
@@ -15,8 +15,8 @@ export type SceneState = {
 };
 
 export type SceneScroll = {
-  scrollX: FlooredNumber;
-  scrollY: FlooredNumber;
+  scrollX: number;
+  scrollY: number;
 };
 
 export interface Scene {