Snapping Demo
This demo shows how the snapping feature can be customized.
In addition to the default snapping features, it adds extra snap lines to the bounds of
labels, lets the outline of the star shaped nodes snap to grid points, and uses free
additional snap lines nodes can snap to.
Things to Try
-
Move the topmost orange node and one of the star shaped nodes around
and compare their different grid snapping behavior.
While an orange node only snaps to grid points with its center, a star shaped node
snaps with all points of its outline, but then again only to the grid points, not in
between.
-
Move the unconnected orange node close to an orthogonal node or edge label to
snap it to the label's bounds.
-
Move an edge label to a non-orthogonal edge segment to disable node snapping
for this label. Nodes cannot snap to non-orthogonal labels.
-
Move node and and edge labels along their owner's border/path to snap them to
other particular positions relative to the owner.
-
Move a node close to the red snap lines to snap it to these non-graph elements.
- Position of a red snap line by dragging it around.