Interactivity

How to make the chart interactive?

Handle User Interactions

Create workflows that trigger on these events:

• Node clicked - When user clicks any node (example: show popup with node details)

• Node changed position - When user drags nodes (example: update X/Y coordinates in database)

• Edge added/removed - When user creates/deletes connections (example: update relationships in database)

• Edge clicked - When user clicks any connection line (example: show connection properties dialog)

• Edge dropped on canvas - When user drags edge but drops it on empty space (example: create new node dynamically at drop location)

Control the Chart

Use these actions in your workflows:

• Fit view - Zoom to show all nodes perfectly

• Auto layout - Organize nodes with automatic layout

• Zoom in/out or Set zoom - Control zoom level precisely

• Set center - Pan to specific coordinates

• Export to JSON - Get complete chart state with all current positions and connections

• Clear graph - Remove all nodes and edges