Interaction

Hover Show node or edge info when hovering with the mouse

Click Show details about a node or edge when you click on it

Select Listen for selection events on nodes and edges

Disabled state Disable nodes and edges so they can't be selected or hovered

Panning Click and drag to move the camera around the graph

Rectangle selection Draw a rectangle with Ctrl+drag to select nodes or edges

Lasso (nodes) Draw a freehand lasso to select a group of nodes

Selection API Get the currently selected and unselected nodes and edges

Custom selection Build a custom selection mechanism with left and right click

Drag nodes Drag nodes and track their movement with events

Badges interactions Handle clicks and hover on node badges

Node resizing Manually resize nodes by dragging a handle

Container resizing Resize the graph container on the fly

Edge rewiring Drag edge endpoints to rewire connections between nodes

Group selection Group a set of selected nodes into one meta-node

Connect nodes Let users draw new edges by dragging between nodes

Keyboard interactions Bind keyboard shortcuts to graph actions

Draggable/non-draggable nodes Enable or disable dragging on individual nodes

Node snapping Snap nodes to alignment grid while dragging them

Halo masking Fade out non-adjacent edges when hovering a node

Fast highlight Highlight connected nodes and edges on mouse hover

Hold space to drag Hold Space to drag the viewport instead of selecting

Scroll to pan Use scroll to pan the view; Ctrl+scroll to zoom