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.