alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add zoom step to minimap

Browse Source
This commit is contained in:
Artyom Sovetnikov
2023-03-21 16:34:00 +03:00
parent 3663149e2b
commit 40139805f3
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/minimap/src/MiniMap.tsx
+3 -2
View File
@@ -67,7 +67,8 @@ function MiniMap({
pannable = false, pannable = false,
zoomable = false, zoomable = false,
ariaLabel = 'React Flow mini map', ariaLabel = 'React Flow mini map',
inversePan = false inversePan = false,
zoomStep = 10
}: MiniMapProps) { }: MiniMapProps) {
const store = useStoreApi(); const store = useStoreApi();
const svg = useRef<SVGSVGElement>(null); const svg = useRef<SVGSVGElement>(null);
@@ -107,7 +108,7 @@ function MiniMap({
const pinchDelta = const pinchDelta =
-event.sourceEvent.deltaY * -event.sourceEvent.deltaY *
(event.sourceEvent.deltaMode === 1 ? 0.05 : event.sourceEvent.deltaMode ? 1 : 0.002) * (event.sourceEvent.deltaMode === 1 ? 0.05 : event.sourceEvent.deltaMode ? 1 : 0.002) *
10; zoomStep;
const zoom = transform[2] * Math.pow(2, pinchDelta); const zoom = transform[2] * Math.pow(2, pinchDelta);
d3Zoom.scaleTo(d3Selection, zoom); d3Zoom.scaleTo(d3Selection, zoom);
packages/minimap/src/types.ts
+1
View File
@@ -21,6 +21,7 @@ export type MiniMapProps<NodeData = any> = Omit<HTMLAttributes<SVGSVGElement>, '
zoomable?: boolean; zoomable?: boolean;
ariaLabel?: string | null; ariaLabel?: string | null;
inversePan?: boolean; inversePan?: boolean;
zoomStep?: number;
}; };
export interface MiniMapNodeProps { export interface MiniMapNodeProps {