Measure Unit
The
measureUnit property specifies the unit of measure for all location and size-related values assigned to JsDiagram properties or passed as arguments to its methods.
Location and Size of Nodes
Set the
bounds method to change the location and size of a node. Its values are
Rect objects that contain coordinates and dimension properties. The
bounds getter lets you find the current location and size of a node as set by users or layout algorithms.
Links Control Points
Links must have two or more control points, depending on their
shape property. You can get access to the control points via link's
controlPoints collection. You must call
updateFromPoints after programmatically moving control points of a link; that's needed in order to repaint the link and update its internal state variables, such as arrowhead angles.
Link Dynamics
The
dynamic property of a link can be enabled to make the link automatically recalculate its end point positions if the nodes connected to the link are moved or resized; the end points are moved in such a way that the link points to the centers of the connected nodes. Links also expose an
autoRoute property that enables or disables automatic routing for a link. Routed links avoid nodes by finding the shortest path between their
origin and
destination that does not cross any other nodes.
Interactive Moving or Resizing
End-users of your application can move or resize the diagram elements. They do this by selecting an item and dragging any of its adjustment handles, a point inside its interior, any of its sides or a selection frame. The
handlesStyle property of nodes controls how interaction can be performed. Additionally it defines the representation of selected items on screen.
enabledHandles lets you disable specific manipulations users are allowed to perform on a node, for example resizing the item horizontally or moving it. If an item is modified interactively, the
nodeModified or
linkModified event is raised, depending on the item's type.
Controlling Z-order
The Z-order defines how items are ordered along the Z-axis, so that one item appears in front of or behind another one. Diagram items are sorted by the value of their
zIndex property, and rendered on screen in ascending order. You can change the Z index of a
DiagramItem by setting
zIndex (values don't have to be consecutive).
