- I
Remarks
Layout Style
RadialTreeLayout is designed to arrange directed and undirected tree graphs. Subtrees rooted at a node are placed in a radial fashion around their root node. All direct children of one node can be placed on a common circle around their parent node (depending on the alignment policy). Therefore, subtrees look like balloons or stars, especially if subtrees have similar sizes. The edges of the tree are drawn as straight lines.
Concept
The algorithm executes the following steps:
- Select a root node according to the specified policy.
- Determine the placement of subtrees around the root using a bottom-up recursive approach (starting with leaf nodes).
- For a leaf node: calculate the convex hull of the node.
- For a non-leaf node: arrange the children rooted at the node. Children are sorted according to a specified ordering policy and a distance to their parent is chosen. This distance will be chosen such that subtrees rooted at the current node fit into the preferred sector angle. The sector angle defines how much radial space a subtree occupies around its parent; it is computed using the convex hull of subtrees.
Finally, the convex hull of the subtree rooted at the current node is updated in order to include all the convex hulls of child nodes. This is possible, because distances and sectors of the child subtrees are now known.
- Assign the actual coordinates of nodes, again using a recursive approach (starting with the root node).
Features
The algorithm features integrated edge labeling as well as node labeling. Edge labels and node labels are placed automatically without generating overlaps with other labels or graph elements. There are different ways to place node labels. Edge labeling will take the settings of EdgeLabelPreferredPlacement into account.
Defining a preferred sector angle has a great influence on the layout style. Subtrees rooted at a node get a certain amount of radial space to be placed around the parent node, such that a preferred angle close to 360 degrees will generate drawings where subtrees look like balloons, while an angle close to 180 degrees could be chosen to get drawings where subtrees look like semicircles.
Since it is computationally not very complex, RadialTreeLayout is very well suited for large tree graphs. It performs well even for huge graphs.
nodeTypes are considered such that the type of the nodes is used as a criterion for sorting the child nodes of a local root node, with the effect that nodes of the same type are placed consecutively, if possible. If defined, the childOrder is stronger than the node type criterion. However, the node types are considered more important than the childOrderingPolicy.
This layout algorithm can only handle graphs with a tree structure. To make it applicable to general graphs, the treeReductionStage is used by default. This stage will temporarily remove some edges of the input graph until a tree is obtained. These edges will later be reinserted and routed separately.
This layout algorithm handles port placement constraints by applying the PortPlacementStage as a postprocessing step.
Layout Stages
This class provides a configurable pipeline that contains various ILayoutStages. Each ILayoutStage can incorporate preprocessing or postprocessing steps into the layout calculation to streamline the input graph and enhance the resulting layout. Additionally, custom ILayoutStages can be added and executed either before or after the predefined ones.
The following default ILayoutStages are included:
- PortPlacementStage: Assigns edges to ports.
- GroupHidingStage: Removes group nodes and their adjacent edges before layout processing, and reinserts them afterward. The property hidingEmptyGroupNodes is set to
falseand resetEdgePaths is set totrue. - SubgraphLayoutStage: Filters a graph to include only specific nodes and edges from a subgraph while maintaining the positions of excluded elements. Note: This stage is disabled by default.
- ComponentLayout: Arranges graph components with customizable styles. The property style is set to circular component arrangement style.
- GenericLabeling: Efficiently places node and edge labels. The property fillEmptyScope is set to
falseand stopDuration is set to ZERO. - OrientationStage: Changes the layout orientation in four possible directions, with or without mirroring on the x or y-axis.
- SelfLoopRouter: Routes self-loops in a graph, allowing for either orthogonal or rounded routing styles.
- ParallelEdgeRouter: Routes multiple edges between the same nodes in parallel.
- TreeReductionStage: Temporarily reduces general graphs to tree structures, allowing them to be processed by a tree layout algorithm. The property nonTreeEdgeRouter is set to a StraightLineEdgeRouter instance.
With these layoutStages the layout algorithm is configured well, so they usually don't need to be changed.
Performance
The RadialTreeLayout algorithm is a fast algorithm that is generally well-suited to handle even large graphs.
With disconnected graphs that contain large unconnected components, it can be beneficial to change the component arrangement style of the used componentLayout from the default style PACKED_CIRCLE to the faster ROWS style.
Default Values of Properties
| Name | Default | Description |
|---|---|---|
| allowOverlaps | false | Nodes are not allowed to overlap. |
| chainStraighteningMode | false | There is no guarantee that chains are drawn straight. |
| compactnessFactor | 0.5 | A factor offering good balance between compactness and runtime. |
| edgeLabelPlacement | EdgeLabelPlacement.INTEGRATED | Edge labels are placed by the layout algorithm. |
| minimumEdgeLength | 40 | |
| minimumNodeDistance | 10 | |
| nodeLabelPlacement | RadialNodeLabelPlacement.CONSIDER | Node labels are considered by this algorithm. |
| preferredChildSectorAngle | 340 | |
| preferredRootSectorAngle | 360 |
See Also
Developer's Guide
Members
Constructors
Creates a new RadialTreeLayout instance with default settings.
Parameters
Properties
Property Value
true if node overlaps are allowed, false otherwiseDefault Value
Sample Graphs
falseSee Also
Developer's Guide
A chain is defined as a tree node with exactly one child node. If this feature is enabled, then the incoming edge and outgoing edge of the chain will have the same orientation, i.e., the whole chain looks straight.
Straightening all chains can lead to smoother, more symmetric results.
Property Value
true if chains are drawn straight, false otherwise.Default Value
Sample Graphs
falseSee Also
Developer's Guide
Gets or sets the child alignment policy for this layout algorithm.
Property Value
Default Value
See Also
Developer's Guide
Gets or sets the child ordering policy for sorting the child nodes around their parents.
Property Value
Default Value
See Also
Developer's Guide
Smaller values may result in less compact drawings, larger values in more compact drawings.
The algorithm tries to optimize the child node arrangement around each tree node such that each subtree is as close to its root as possible, while still fitting into the preferred sector angle and not overlapping with adjacent subtrees.
Low compactness factor values induce the optimization procedure to be less strict and accept less optimal results, while high factor values mean that the optimization will only stop when being nearly optimal. Thus, higher values lead to a potentially higher runtime.
The compactness factor needs to lie in the interval [0, 1].
Property Value
Throws
- Exception ({ name: 'ArgumentError' })
- if the factor is smaller than
0.0or greater than1.0
Default Value
See Also
Developer's Guide
Gets the ComponentLayout from the layoutStages of this instance.
Throws
- Exception ({ name: 'InvalidOperationError' })
- If there is no instance of the respective type in the layoutStages
Gets or sets how the layout handles the position of edge labels.
Property Value
Default Value
Sample Graphs
See Also
Developer's Guide
0, labels will touch each other and the target node.Property Value
Throws
- Exception ({ name: 'ArgumentError' })
- if the given label spacing value is negative
Default Value
Sample Graphs
4.0See Also
A lower minimum edge length allows generally more compact layouts. It has the highest effect if most nodes of the graph have a low degree, as the minimum can potentially be met for such graphs.
The minimum length must be non-negative.
Property Value
Throws
- Exception ({ name: 'ArgumentError' })
- if the given length is negative
Default Value
Sample Graphs
20See Also
Developer's Guide
Property Value
Throws
- Exception ({ name: 'ArgumentError' })
- if the given minimum distance is negative
Default Value
Sample Graphs
0 (default)See Also
Gets or sets how the layout algorithm handles node labels.
Property Value
- IGNORE if node labels should be ignored during the layout process.
- CONSIDER if node label positions relative to their owner should be maintained and considered for the placement of other graph elements to avoid overlaps.
- HORIZONTAL if horizontal node label positions should be calculated by this layout algorithm, assuring that no overlaps occur.
- RAY_LIKE if ray-like node label positions should be calculated by this layout algorithm, assuring that no overlaps occur.
- RAY_LIKE_LEAVES if a mix of horizontal and ray-like node label positions should be calculated by this layout algorithm, assuring that no overlaps occur.
- GENERIC if the node labels should be placed by the GenericLabeling algorithm subsequently.
Default Value
Sample Graphs
See Also
Developer's Guide
API
- RadialNodeLabelPlacement
It also defines the distance between labels and the node they belong to in case of label placement outside of the node (e.g. for ray-like label placement).
The spacing must have a non-negative value.
0, node labels will be maximally close to each other and to their node.Property Value
Throws
- Exception ({ name: 'ArgumentError' })
- if the given spacing value is negative
Default Value
Sample Graphs
4.0See Also
Gets the ParallelEdgeRouter from the layoutStages of this instance.
Throws
- Exception ({ name: 'InvalidOperationError' })
- If there is no instance of the respective type in the layoutStages
The sector angle controls the degree to which the child nodes may radiate from the center of layout. A value close to 360 means that the child nodes may radiate in (almost) any direction from their parent node, edge lengths can in consequence stay rather small. On the other hand, a small value means that children are restricted to a small angle; thus, edge lengths (and drawings) may become large.
The minimum allowed sector angle is 1 and the maximum allowed value is 359.
360 is needed.Property Value
[1,359]Throws
- Exception ({ name: 'ArgumentError' })
- if the given angle is smaller than
1or larger than359
Default Value
Sample Graphs
359 (same for root node)See Also
Developer's Guide
API
- preferredRootSectorAngle
This property allows to separately control the sector angle for the designated root node of the tree, while preferredChildSectorAngle controls the angles of all child nodes. The root node will be determined depending on the rootSelectionPolicy.
The minimum allowed root sector angle is 1 and the maximum allowed value is 360.
Property Value
[1,360]Throws
- Exception ({ name: 'ArgumentError' })
- if the given angle is smaller than
1or larger than360
Default Value
Sample Graphs
180See Also
Developer's Guide
API
- preferredChildSectorAngle
Gets or sets the root node selection policy of this layout algorithm.
The policy determines which node is chosen as (virtual) tree root during the layout process.
To define a custom root node instead of using the predefined policies, utilize the property treeRoot. In this case, the value of rootSelectionPolicy will be ignored.
Property Value
Default Value
See Also
Developer's Guide
Gets the SelfLoopRouter from the layoutStages of this instance.
Throws
- Exception ({ name: 'InvalidOperationError' })
- If there is no instance of the respective type in the layoutStages
Gets the TreeReductionStage from the layoutStages of this instance.
Throws
- Exception ({ name: 'InvalidOperationError' })
- If there is no instance of the respective type in the layoutStages
Methods
Calculates a radial tree layout of the graph.
Parameters
- graph: LayoutGraph
- the input graph
Implements
ILayoutAlgorithm.applyLayoutArranges the given graph as a tree graph in a radial-tree-like fashion.
Parameters
- graph: LayoutGraph
- The input graph
Throws
- Exception ({ name: 'ArgumentError' })
- If the given graph is not a tree
createLayoutData
(graph: LayoutGraph): RadialTreeLayoutData<LayoutNode, LayoutEdge, LayoutNodeLabel, LayoutEdgeLabel>Returns an instance of LayoutData<TNode, TEdge, TNodeLabel, TEdgeLabel> that can be used to perform item-specific configurations for the RadialTreeLayout.
createLayoutData
(graph: LayoutGraph): RadialTreeLayoutData<LayoutNode, LayoutEdge, LayoutNodeLabel, LayoutEdgeLabel>Parameters
- graph: LayoutGraph
- the graph that determines the generic type arguments of the created layout data
Return Value
- RadialTreeLayoutData<LayoutNode, LayoutEdge, LayoutNodeLabel, LayoutEdgeLabel>
- an instance of layout data that can be used to perform item-specific configurations for the given RadialTreeLayout.
Returns an instance of LayoutData<TNode, TEdge, TNodeLabel, TEdgeLabel> that can be used to perform item-specific configurations for the RadialTreeLayout.
LayoutExecutor type is available at runtime.Parameters
- graph?: IGraph
- the graph that determines the generic type arguments of the created layout data
Return Value
- RadialTreeLayoutData<INode, IEdge, ILabel, ILabel>
- an instance of layout data that can be used to perform item-specific configurations for the given RadialTreeLayout.