Layout Features Tutorial

Hierarchic Layout with Edge Labeling

This demo shows how to configure the Hierarchic Layout for automatic edge label placement.

Configuring label placement

Label models and their parameters determine the position of a label. For many interactive use cases, it makes sense to choose a model that restricts the available positions in some way. However, for automatic label placement the opposite is true: Models that do not impose restrictions on a label's position work best. Thus FreeEdgeLabelModel and SmartEdgeLabelModel are good choices for integrated label placement.

PreferredPlacementDescriptors may be associated with labels to control automatic placement. Such a descriptor determines if the algorithm will place a label close to its owner edge's source or target node, next to or on the edge, or even rotate the label.

The demo configures several descriptors for placing each label in a way that matches its text - with two notable exceptions: For the labels Upside down and Upwards, the actual rotation does not match the implied rotation. This is because, by default, Hierarchic Layout's labeling algorithm ensures that a rotated label's up vector does not point downwards. Uncommenting the corresponding line in the demo's source code will turn this feature off and enable upside down labels.

Code Snippet

You can copy the code snippet to configure the layout from GitHub.

Demos

See the Edge Label Placement demo for a more elaborate example regarding automatic edge label placement.

Documentation

The Labeling and Automatic Label Placement sections in the Developer's Guide contain in-depth discussions of the relevant concepts.

See the PreferredPlacementDescriptor API documentation for detailed information on all available placement options.