Rendering Order Demo
Sometimes it is necessary to change the render order of graph, e.g. when labels should be
rendered in front of their owner but behind another item. This demo shows how to use
GraphModelManager to configure the rendering order for grouped graphs as
well as layer policies for labels and ports.
Each item type is assigned to a specific canvas object group. These groups have a default
rendering order from back to front. See
The Z-order of Graph Elements for more
information about the different ICanvasObjectGroups and their default
For grouped graphs, we provide some nesting policies to structure nodes and edges in more
complex hierarchies. In these cases, some of the canvas object groups may not be used.
- Default: The rendering order that is used by default.
Labels / Ports at Owner: The labels and ports are rendered on the same z-order
as their owner.
Edges on Top: Edges are rendered on top of the nodes. Note in this case, we
also enabled the labels and ports at owner configuration.
Group Nodes: Maintains the rendering order according to the nesting depth for
group nodes while nodes and edges are placed in the separate groups and are not
interleaved in the rendering.
None: Items are placed in their respective canvas object group without
considering the nesting hierarchy of the nodes. Usually, this setting is only used when
the z-order is managed by a different mechanism.