feat(useZoomPanHelper) add setCenter func

src/hooks/useZoomPanHelper.ts

@@ -12,6 +12,7 @@ const initialZoomPanHelper: ZoomPanHelperFunctions = {
   zoomTo: (_: number) => {},
   transform: (_: FlowTransform) => {},
   fitView: (_: FitViewParams = { padding: 0.1 }) => {},
+  setCenter: (_: number, __: number) => {},
   initialized: false,
 };
 
@@ -51,6 +52,16 @@ const usePanZoomHelper = (): ZoomPanHelperFunctions => {
 
           d3Zoom.transform(d3Selection, transform);
         },
+        setCenter: (x: number, y: number, zoom?: number) => {
+          const { width, height, maxZoom } = store.getState();
+
+          const nextZoom = typeof zoom !== 'undefined' ? zoom : maxZoom;
+          const centerX = width / 2 - x * nextZoom;
+          const centerY = height / 2 - y * nextZoom;
+          const transform = zoomIdentity.translate(centerX, centerY).scale(nextZoom);
+
+          d3Zoom.transform(d3Selection, transform);
+        },
         initialized: true,
       };
     }

src/types/index.ts

@@ -354,6 +354,7 @@ export interface ZoomPanHelperFunctions {
   zoomTo: (zoomLevel: number) => void;
   transform: (transform: FlowTransform) => void;
   fitView: (params?: FitViewParams) => void;
+  setCenter: (x: number, y: number, zoom?: number) => void;
   initialized: boolean;
 }