Node Drag Alignment Guides
This example shows how to mount relation-graph's alignment-guide overlay so dragged nodes can display temporary reference lines. It also combines an optional adsorption toggle, selection-state coordination, runtime canvas settings, and image export inside a compact editor-style workspace.
Dragging Nodes with Alignment Guides and Optional Snapping
What This Example Builds
This example builds a compact graph editing workspace that shows temporary alignment guides while a node is being dragged. The screen combines a full-height dotted canvas, a floating instruction window, a small inline graph, and a checkbox that turns the alignment helper’s adsorption behavior on or off at runtime.
Users can drag nodes, click nodes and lines to change the current editing target, clear edit