void graphComponent.fitGraphBounds()This step shows how to work with the viewport of a GraphComponent.
The graph in this example consists of four nodes, only three of which are visible in the initial viewport. The fourth node is initially outside the viewport. Calling the fitGraphBounds method adjusts the viewport of the GraphComponent to contain the complete graph.
void graphComponent.fitGraphBounds()
The zoom and viewPoint can also be set manually. In this sample, we use both to reset the viewport to the initial state.
graphComponent.zoom = 1
graphComponent.viewPoint = Point.ORIGIN
Fitting the graph bounds actually consists of two operations, which are combined in fitGraphBounds. First, the contentBounds of the GraphComponent is adjusted to the current graph size. Then, the content rect is fitted into the view using fitContent. Calling fitGraphBounds has the same result as the following code:
graphComponent.updateContentBounds()
await graphComponent.fitContent()Fitting the graph bounds can also be animated using the optional parameters of the fitGraphBounds method.
await graphComponent.fitGraphBounds({ animated: true })
|
Note
|
Whether some of the default (keyboard) commands are animated can be configured with animatedViewportChanges. |