Referenceutils
getViewportForBounds()

getViewportForBounds()

Source on Github

This util returns the viewport for the given bounds. You might use this to pre-calculate the viewport for a given set of nodes on the server or calculate the viewport for the given bounds without changing the viewport directly.

import { getViewportForBounds } from '@xyflow/svelte';
 
const { x, y, zoomn } = getViewportForBounds(
  {
    x: 0,
    y: 0,
    width: 100,
    height: 100,
  },
  1200,
  800,
  0.5,
  2,
);

Signature

#Params
#bounds
Rect
#width
number
#height
number
#minZoom
number
#maxZoom
number
#padding?
number
0.1
#Returns
#viewport
Viewport
The transformed viewport (`{ x: number, y: number, zoom: number }`).

Notes

  • This is quite a low-level utility. You might want to look at the fitView or fitBounds methods for a more practical api.
Types