Component Drag and Drop Demo
A demo that shows how to make space for components that you can drag from a palette onto
the canvas.
If a component is dragged from the palette onto the canvas, the
ClearAreaLayout
algorithm will push away the other elements so there is a free area for the component.
This is also the case when dragging a component that is already part of the graph.
Things to Try
-
Drag a component from the palette onto the canvas and watch the graph give way to it.
- Drop the dragged component at the desired location.
- Press the ESC key while dragging to cancel the drag and drop operation.
-
Select the button
Keep Components
to prevent the components from being changed during the drag and drop operation.
-
Select a component by clicking on a node, drag the component through the remaining
graph, and watch how the graph changes to provide space for it.
Related Demos