Last updated on
2025-03-27
2025-03-27
Well, you are in for a treat! No more hacks, no more setTimeout or requestAnimationFrame and no more split second frames of unfitted views!
setNodes((nodes) => [nodes, ...newNode]);
fitView(); // it just works.
// adding a new node and fitting the view happens at the same timeYou might have realized that the padding value for fitViewOptions is quite a weird fella! What does padding: 0.3 even mean? Well we don’t know either, so you you can now pass pixel values '25px', viewport percentages '10%' and true pros can now even
const fitViewOptions = {
padding: {
/** horizontal */
x: '100px',
/** vertical */
y: '50px',
/** e.g. top overwrites x */
top: '25px',
/** mix and match units */
left: '15%',
/** legacy units still work */
bottom: 0.1,
/** have a modal on the right that stretches 50% over the screen? */
right: '50%',
setNodes((nodes) => [nodes, ...newNode]);
fitView(); // it just works.
// adding a new node and fitting the view happens at the same timeBackgroundProps, EdgeLabelOptions, ControlProps, NodeToolbarProps, EdgeLabelRendererProps, EdgeLabelOptions and EdgeTextProps