This layout algorithm arranges graphs in a circular fashion.
Remarks
Layout Style
The nodes are arranged in circles and stars which emphasize group and tree structures inside a graph. Circular layout algorithms find applications in many areas such as social networking, network management, WWW visualization, eCommerce, telecommunications.
Concept
The layout algorithm performs three steps when calculating a circular arrangement for a graph:
- It searches for partitions in the input graph depending on connectivity and on the given layout style. Considering each partition as a node, the resulting graph has a tree-like structure.
- The partitions are laid out as circles using the selected partition style.
- The algorithm delegates the layout calculation for the underlying tree (in which each node corresponds to a partition) to a specialized layout algorithm accessible by singleCycleLayout or balloonLayout. The partitions are moved to their final location.
Features
The layout algorithm places the nodes in circles that represent a partition. There are several ways to find partitions in the input graph. Which one is applied is defined using layoutStyle.
The nodes in a partition can either lie on or in the interior of a circle. The placement of the nodes affects the compactness of the layout and can be specified using partitionStyle.
Since edges are routed as straight lines, they may overlap with nodes or node labels. To resolve these overlaps, an edge routing algorithm (e.g. EdgeRouter or OrganicEdgeRouter) can be appended.
Edges that belong to the same circle partition can be routed around the exterior of the circle. The edge routing policy determines which edges are exterior and routing details of these edges can be configured via exteriorEdgeLayoutDescriptor. Exterior edge routes consist of smooth arcs. Edges that are routed externally can significantly improve the readability of the circular layout by reducing the edge clutter in the interior of the circle. This holds true especially for graph with a large number of edges. On the other hand, it significantly increases the amount of required space and, thus, is not recommended when maximally compact layouts are desired.
This layout algorithm supports edge bundling. In order to bundle the edges, the nodes of the graph are clustered in groups. Edge bundling is supported only if partition layout style is set to CYCLE and layout style is other than BCC_ISOLATED.
Default Values of Properties
| componentLayoutEnabled | true | The stage that arranges connected graph components is activated. |
| considerNodeLabels | false | Node labels are not taken into account. |
| edgeRoutingPolicy | INTERIOR | Edges are routed as simple straight lines on the interior. |
| fromSketchMode | false | The layout algorithm does not consider the initial coordinates of the nodes. |
| hideGroupsStageEnabled | true | The stage responsible for hiding group nodes is activated. |
| integratedNodeLabeling | false | Node labels are not placed by this algorithm. |
| layoutStyle | BCC_COMPACT | |
| maximumDeviationAngle | 90 | |
| nodeLabelingPolicy | RAY_LIKE_LEAVES | |
| orientationLayoutEnabled | true | The orientation |
| partitionStyle | CYCLE | |
| placeChildrenOnCommonRadius | true | Children are placed on a common radius. |
| selfLoopRouterEnabled | true | The stage that routes self-loops is activated. |
Type Details
- yfiles module
- layout-organic
- yfiles-umd modules
- layout-multipage, layout-organic, layout
- Legacy UMD name
- yfiles.circular.CircularLayout
See Also
Constructors
Creates a new CircularLayout instance with the default settings.
Parameters
A map of options to pass to the method.
- considerNodeLabels - boolean
Whether or not the layout algorithm reserves space for node labels preventing possible overlaps. This option sets the considerNodeLabels property on the created object.
- integratedNodeLabeling - boolean
Whether or not the layout algorithm automatically places node labels. This option sets the integratedNodeLabeling property on the created object.
- nodeLabelSpacing - number
The distance between node labels belonging to the same node. This option sets the nodeLabelSpacing property on the created object.
- nodeLabelingPolicy - NodeLabelingPolicy
The policy defining how node labels are placed by the integrated node labeling mechanism (for example, the desired label orientation). This option sets the nodeLabelingPolicy property on the created object.
- placeChildrenOnCommonRadius - boolean
Whether or not, in the underlying tree, the children of a tree node are placed on a common radius. This option sets the placeChildrenOnCommonRadius property on the created object.
- fromSketchMode - boolean
Whether or not to take the coordinates of the input diagram into account when arranging the nodes of the partitions and the partitions themselves. This option sets the fromSketchMode property on the created object.
- starSubstructureStyle - CircularLayoutStarSubstructureStyle
The layout style for star substructures. This option sets the starSubstructureStyle property on the created object.
- starSubstructureSize - number
The minimum size (number of nodes including the root) a star needs to have to be detected and handled as a star substructure. This option sets the starSubstructureSize property on the created object.
- starSubstructureTypeSeparation - boolean
Whether star substructures should be separated by the node type. This option sets the starSubstructureTypeSeparation property on the created object.
- maximumDeviationAngle - number
The maximum deviation angle allowed for an edge. This option sets the maximumDeviationAngle property on the created object.
- layoutStyle - CircularLayoutStyle
The global layout style for this layout algorithm. This option sets the layoutStyle property on the created object.
- partitionStyle - PartitionStyle
The style for the arrangement of each partition. This option sets the partitionStyle property on the created object.
- exteriorEdgeLayoutDescriptor - ExteriorEdgeLayoutDescriptor
The descriptor that defines settings for the exterior edges. This option sets the exteriorEdgeLayoutDescriptor property on the created object.
- defaultEdgeLayoutDescriptor - CircularLayoutEdgeLayoutDescriptor
The descriptor that defines settings for the non-exterior edges. This option sets the defaultEdgeLayoutDescriptor property on the created object.
- edgeRoutingPolicy - CircularLayoutEdgeRoutingPolicy
The edge routing policy that determines whether edges are routed internally or externally with respect to a single partition circle. This option sets the edgeRoutingPolicy property on the created object.
- componentLayoutEnabled - boolean
Whether or not the ILayoutStage used for arranging the components of the graph is activated. This option sets the componentLayoutEnabled property on the created object.
- hideGroupsStageEnabled - boolean
Whether or not the ILayoutStage used for hiding group nodes is activated. This option sets the hideGroupsStageEnabled property on the created object.
- orientationLayoutEnabled - boolean
Whether or not the ILayoutStage that modifies the orientation of the layout is activated. This option sets the orientationLayoutEnabled property on the created object.
- selfLoopRouterEnabled - boolean
Whether or not the ILayoutStage used for routing self-loops is activated. This option sets the selfLoopRouterEnabled property on the created object.
- labeling - ILayoutStage
The ILayoutStage that places the labels of the input graph. This option sets the labeling property on the created object.
- selfLoopRouter - ILayoutStage
The ILayoutStage that routes self-loops. This option sets the selfLoopRouter property on the created object.
- parallelEdgeRouter - ILayoutStage
The ILayoutStage that routes parallel edges. This option sets the parallelEdgeRouter property on the created object.
- componentLayout - ILayoutStage
The ILayoutStage that arranges the connected components of an input graph. This option sets the componentLayout property on the created object.
- subgraphLayout - ILayoutStage
The ILayoutStage that constrains the layout process to a subgraph of the input graph. This option sets the subgraphLayout property on the created object.
- hideGroupsStage - ILayoutStage
The ILayoutStage that hides the group nodes of the input graph. This option sets the hideGroupsStage property on the created object.
- orientationLayout - ILayoutStage
The ILayoutStage that modifies the orientation of a computed layout. This option sets the orientationLayout property on the created object.
- layoutOrientation - LayoutOrientation
The main orientation of the layout. This option sets the layoutOrientation property on the created object.
- labelingEnabled - boolean
Whether or not the ILayoutStage used for placing the labels of the input graph is activated. This option sets the labelingEnabled property on the created object.
- parallelEdgeRouterEnabled - boolean
Whether or not the ILayoutStage used for routing parallel edges is activated. This option sets the parallelEdgeRouterEnabled property on the created object.
- subgraphLayoutEnabled - boolean
Whether or not the ILayoutStage used for constraining the layout process to a subgraph of the input graph is activated. This option sets the subgraphLayoutEnabled property on the created object.
Properties
Gets the BalloonLayout instance used for arranging multiple partitions.
Remarks
See Also
Gets or sets the ILayoutStage that arranges the connected components of an input graph.
Default Value
See Also
Defined in
Sets whether or not the ILayoutStage used for arranging the components of the graph is activated.
Default Value
true.The stage that arranges connected graph components is activated.
See Also
Overrides
Gets or sets whether or not the layout algorithm reserves space for node labels preventing possible overlaps.
Remarks
Nodes get temporarily enlarged such that they contain their labels.
This might result in layouts that need much space.
Default Value
false.Node labels are not taken into account.
See Also
Sample Graphs
Gets or sets the descriptor that defines settings for the non-exterior edges.
Remarks
Throws
- Exception({ name: 'ArgumentError' })
- if the given descriptor is
null
See Also
Gets the EdgeBundling instance that defines the settings of the edge bundling feature.
Remarks
See Also
Gets or sets the edge routing policy that determines whether edges are routed internally or externally with respect to a single partition circle.
Remarks
- Non-exterior edges are routed as simple straight lines that directly connect the source and target node. This is the default style for the circular layout.
- Exterior edges get an arc-like curved path around the exterior of the circle. Only edges between nodes of the same partition (i.e. on the same circle) can be exterior edges. These edges may be beneficial in cases with a large number of edge crossings inside the circle: by moving some edges out, the number of crossings is reduced and the layout may become more readable. The drawback is the larger space that is required.
Default Value
Throws
- Exception({ name: 'ArgumentError' })
- if the given edge routing policy is unknown
See Also
Gets or sets the descriptor that defines settings for the exterior edges.
Remarks
Throws
- Exception({ name: 'ArgumentError' })
- if the given descriptor is
null
See Also
Gets or sets whether or not to take the coordinates of the input diagram into account when arranging the nodes of the partitions and the partitions themselves.
Remarks
- For complex partitions (those consisting of more than one node), the layout algorithm tries to keep peripheral nodes and maintain their circular order around the center of the disk/circle. Other partitions that connect to this node are moved accordingly, if possible.
- For multiple partitions that connect to the same node, the layout algorithm tries to keep their circular order around this node. This only works as expected for BCC_COMPACT as layout style, since otherwise the underlying tree structure is not well defined.
Default Value
false.The layout algorithm does not consider the initial coordinates of the nodes.
See Also
Sample Graphs
Gets or sets the ILayoutStage that hides the group nodes of the input graph.
Default Value
See Also
Defined in
Sets whether or not the ILayoutStage used for hiding group nodes is activated.
Default Value
true.The stage responsible for hiding group nodes is activated.
See Also
Overrides
Gets or sets whether or not the layout algorithm automatically places node labels.
Remarks
If enabled, this layout algorithm will calculate the positions for the node labels assuring that no overlaps occur.
Different labeling strategies may be selected using nodeLabelingPolicy.
Default Value
false.Node labels are not placed by this algorithm.
See Also
Sample Graphs
Gets or sets the ILayoutStage that places the labels of the input graph.
Default Value
See Also
Defined in
Gets or sets whether or not the ILayoutStage used for placing the labels of the input graph is activated.
Remarks
Default Value
false.The stage responsible for label placement is deactivated.
See Also
Defined in
Gets or sets the main orientation of the layout.
Remarks
Default Value
Throws
- Exception({ name: 'ArgumentError' })
- if the specified orientation does not match a default layout orientation
See Also
Defined in
Gets or sets the global layout style for this layout algorithm.
Default Value
Throws
- Exception({ name: 'ArgumentError' })
- if an unknown layout style is set
See Also
Gets or sets the maximum deviation angle allowed for an edge.
Remarks
Default Value
90.See Also
Sample Graphs
Gets or sets the policy defining how node labels are placed by the integrated node labeling mechanism (for example, the desired label orientation).
Default Value
Throws
- Exception({ name: 'ArgumentError' })
- if an unknown labeling policy is given
See Also
Gets or sets the distance between node labels belonging to the same node.
Remarks
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.
Default Value
2.0.Throws
- Exception({ name: 'ArgumentError' })
- if the given spacing value is negative
See Also
Sample Graphs
0, node labels will be maximally close to each other and to their node.Gets or sets the ILayoutStage that modifies the orientation of a computed layout.
Default Value
See Also
Defined in
Sets whether or not the ILayoutStage that modifies the orientation of the layout is activated.
Default Value
true.The orientation
See Also
Overrides
Gets or sets the ILayoutStage that routes parallel edges.
Default Value
See Also
Defined in
Gets or sets whether or not the ILayoutStage used for routing parallel edges is activated.
Remarks
Default Value
true.The stage that routes parallel edges is activated.
See Also
Defined in
Gets or sets whether or not, in the underlying tree, the children of a tree node are placed on a common radius.
Remarks
Default Value
true.Children are placed on a common radius.
See Also
Sample Graphs
Gets or sets the ILayoutStage that routes self-loops.
Default Value
See Also
Defined in
Sets whether or not the ILayoutStage used for routing self-loops is activated.
Default Value
true.The stage that routes self-loops is activated.
See Also
Overrides
Gets the SingleCycleLayout instance used for laying out nodes on a single cycle.
Remarks
See Also
Gets or sets the minimum size (number of nodes including the root) a star needs to have to be detected and handled as a star substructure.
Gets or sets the layout style for star substructures.
Remarks
A star consists of a set of nodes with degree one that are all connected to the same node (called the root of the star). Use property starSubstructureSize to define the minimum number of nodes, including the root, a star must contain to be detected as a substructure.
If there are user-defined node types, by default, a star substructure only contains nodes of the same type or only nodes without a type (i.e. null as type). This way, node types can be used to control which elements are allowed to form a substructure.
Default Value
Throws
- Exception({ name: 'ArgumentError' })
- if the given style is unknown
See Also
Gets or sets whether star substructures should be separated by the node type.
Remarks
Default Value
true.Star substructures are strictly separated by node type.
See Also
Sample Graphs
Gets or sets the ILayoutStage that constrains the layout process to a subgraph of the input graph.
Default Value
See Also
Defined in
Gets or sets whether or not the ILayoutStage used for constraining the layout process to a subgraph of the input graph is activated.
Remarks
Default Value
false.The stage that constrains the input graph to a subgraph is deactivated.
See Also
Defined in
Methods
Appends the given ILayoutStage to the layout pipeline.
Remarks
Parameters
A map of options to pass to the method.
- stage - ILayoutStage
- the ILayoutStage instance to be added
See Also
Defined in
Calculates a circular layout for the given graph.
Remarks
The given graph will not be copied during the layout process and the layout will be immediately applied to the given graph.
This method is not side effect free in the sense that the order of edges or nodes in the input graph may change during the layout process.
Parameters
A map of options to pass to the method.
- graph - LayoutGraph
- the input graph
See Also
Overrides
Arranges the given graph in a circular fashion.
Parameters
A map of options to pass to the method.
- graph - LayoutGraph
- the input graph
Implements
Checks the sizes of the nodes to be non-zero.
Parameters
A map of options to pass to the method.
- g - LayoutGraph
- The graph to check.
Defined in
Deactivates all predefined ILayoutStages so that upon applyLayout only the layout algorithm will be executed.
See Also
Defined in
Prepends the given ILayoutStage to the layout pipeline.
Remarks
Parameters
A map of options to pass to the method.
- stage - ILayoutStage
- the ILayoutStage instance to be added
See Also
Defined in
Removes the given ILayoutStage from the layout pipeline.
Remarks
Parameters
A map of options to pass to the method.
- stage - ILayoutStage
- a ILayoutStage to be removed from the layout pipeline
See Also
Defined in
Constants
A data acceptor key for publishing the final circle information.
Remarks
| Domain | YNode | the nodes of the input graph |
| Values | number | the ID of the circle to which a node belongs |
See Also
A data provider key for defining custom node partitions.
Remarks
| Domain | YNode | the nodes of the input graph |
| Values | Object | the unique ID for each group of nodes |
See Also
A data provider key for specifying the directedness of edges.
Remarks
Generally, the circular layout algorithm doesn't consider the edge direction. Nevertheless, this IDataProvider allows the user to specify hints on the directedness of edges. More precisely, a value of 1 indicates that the edge should be considered to be directed from source to target, a value of -1 that it is directed from target to source, and a value of 0 means that it is undirected.
Currently, the specified values are only considered during the detection of star substructures if the substructure style is set to SEPARATED_RADIAL.
| Domain | Edge | the edges of the input graph |
| Values | number | the directedness of the edge |
See Also
A data provider key for marking edges that should be routed externally, around the circle instead of inside.
Remarks
| Domain | Edge | |
| Values | boolean | true if the edge should become an exterior edge routed outside of the circle, false if the edge should be an interior edge |