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

feat(fitView): added fitViewParams prop to Control component

Browse Source
This commit is contained in:
Eugene Samonenko
2021-02-07 10:13:16 +02:00
parent 97cc7e3d99
commit 7dc2c69f2e
3 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/hooks/useZoomPanHelper.ts
+8 -5
View File
@@ -6,12 +6,14 @@ import { clamp } from '../utils';
import { getRectOfNodes } from '../utils/graph';
import { FitViewParams, FlowTransform, ZoomPanHelperFunctions, Rect, Transform } from '../types';
const DEFAULT_PADDING = 0.1
const initialZoomPanHelper: ZoomPanHelperFunctions = {
zoomIn: () => {},
zoomOut: () => {},
zoomTo: (_: number) => {},
transform: (_: FlowTransform) => {},
fitView: (_: FitViewParams = { padding: 0.1, excludeHidden: false }) => {},
fitView: (_: FitViewParams = { padding: DEFAULT_PADDING, excludeHidden: false }) => {},
setCenter: (_: number, __: number) => {},
fitBounds: (_: Rect) => {},
initialized: false,
@@ -23,7 +25,7 @@ const getTransformForBounds = (
height: number,
minZoom: number,
maxZoom: number,
padding = 0.1
padding = DEFAULT_PADDING
): Transform => {
const xZoom = width / (bounds.width * (1 + padding));
const yZoom = height / (bounds.height * (1 + padding));
@@ -53,7 +55,7 @@ const useZoomPanHelper = (): ZoomPanHelperFunctions => {
d3Zoom.transform(d3Selection, nextTransform);
},
fitView: (options: FitViewParams = { padding: 0.1, excludeHidden: false }) => {
fitView: (options: FitViewParams = { padding: DEFAULT_PADDING, excludeHidden: false }) => {
const { nodes, width, height, minZoom, maxZoom } = store.getState();
if (!nodes.length) {
@@ -61,7 +63,8 @@ const useZoomPanHelper = (): ZoomPanHelperFunctions => {
}
const bounds = getRectOfNodes(options.excludeHidden ? nodes.filter(node => !node.isHidden) : nodes);
const [x, y, zoom] = getTransformForBounds(bounds, width, height, minZoom, maxZoom, options.padding);
const padding = options.padding || DEFAULT_PADDING
const [x, y, zoom] = getTransformForBounds(bounds, width, height, minZoom, maxZoom, padding);
const transform = zoomIdentity.translate(x, y).scale(zoom);
d3Zoom.transform(d3Selection, transform);
@@ -76,7 +79,7 @@ const useZoomPanHelper = (): ZoomPanHelperFunctions => {
d3Zoom.transform(d3Selection, transform);
},
fitBounds: (bounds: Rect, padding = 0.1) => {
fitBounds: (bounds: Rect, padding = DEFAULT_PADDING) => {
const { width, height, minZoom, maxZoom } = store.getState();
const [x, y, zoom] = getTransformForBounds(bounds, width, height, minZoom, maxZoom, padding);
const transform = zoomIdentity.translate(x, y).scale(zoom);