diff --git a/example/src/Overview/index.tsx b/example/src/Overview/index.tsx index b577984d..ee13f916 100644 --- a/example/src/Overview/index.tsx +++ b/example/src/Overview/index.tsx @@ -40,6 +40,7 @@ const onLoad = (reactFlowInstance: OnLoadParams) => { reactFlowInstance.fitView(); }; +const onMoveStart = (transform?: FlowTransform) => console.log('zoom/move start', transform); const onMoveEnd = (transform?: FlowTransform) => console.log('zoom/move end', transform); const onEdgeContextMenu = (_: MouseEvent, edge: Edge) => console.log('edge context menu', edge); const onEdgeMouseEnter = (_: MouseEvent, edge: Edge) => console.log('edge mouse enter', edge); @@ -179,6 +180,7 @@ const OverviewFlow = () => { onSelectionDragStop={onSelectionDragStop} onSelectionContextMenu={onSelectionContextMenu} onSelectionChange={onSelectionChange} + onMoveStart={onMoveStart} onMoveEnd={onMoveEnd} onLoad={onLoad} connectionLineStyle={connectionLineStyle} diff --git a/src/container/ZoomPane/index.tsx b/src/container/ZoomPane/index.tsx index 9bf54ea4..5af2659b 100644 --- a/src/container/ZoomPane/index.tsx +++ b/src/container/ZoomPane/index.tsx @@ -181,12 +181,10 @@ const ZoomPane = ({ if (d3Zoom) { if (onMoveStart) { d3Zoom.on('start', (event: any) => { - if (viewChanged(prevTransform.current, event.transform)) { - const flowTransform = eventToFlowTransform(event.transform); - prevTransform.current = flowTransform; + const flowTransform = eventToFlowTransform(event.transform); + prevTransform.current = flowTransform; - onMoveStart(flowTransform); - } + onMoveStart(flowTransform); }); } else { d3Zoom.on('start', null);