A ILayoutStage that bundles the edges of general undirected graphs to avoid visual cluttering.
Remarks
Bundling together multiple edges means that their common parts are to some degree merged into a bundled part, which is a useful technique to increase the readability of straight-line graph drawings with a high number of edges that connect a comparably small number of nodes. This stage provides means to generate bundled edge paths for any given layout, i.e., the layout generated by a specified core layout algorithm. To determine whether two edges can be bundled, the algorithm computes a compatibility measure that is composed of various criteria (e.g. edges that are closer together or have similar length are more compatible). Note that this stage ignores the edge bends and handles them all as straight-lines. Furthermore, it doesn't prevent overlaps between nodes and edges.
Concept
The implemented algorithm is based on the description in: "Force-directed Edge Bundling for Graph Visualization" by Danny Holten and Jarke J. van Wijk, in Computer Graphics Forum 28(3): 893-990, 2009.
The main idea of the algorithm is that the edges are subdivided into segments and between each pair of consecutive subdivision points spring and electrostatic forces are exerted. At each iteration step, each subdivision point is moved according to the combined force exerted on it. The algorithm runs in six cycles and starts with an initial number of subdivision points for each edge and an initial step size that determines the distance to which each subdivision point can be moved in the direction of the combined force (exerted on it) at each iteration step of the algorithm. After each cycle run, the value of the step size is halved.
Features
Global settings of the bundling can be configured using an EdgeBundling instance. In particular, it is possible to determine which of the edges are compatible and thus, can be bundled together by specifying the strength of the edge bundles using the bundlingStrength property. For the particular algorithm, the default value for this property is 0.4
. The bundling quality is related to the distance to which a subdivision point can be moved at each iteration step of the algorithm. The default value is 1
.
The individual style of each edge can be configured using an EdgeBundleDescriptor. A IDataProvider can be registered with the input graph with key EDGE_BUNDLE_DESCRIPTOR_DP_KEY to assign descriptors to edges. This allows, for example, to define which edges should actually be bundled.
To visualize better the result of the edge bundling algorithm, it is recommended that the edges are rendered using an opacity factor. In this manner, edges that are strongly bundled together will be emphasized more, in comparison to others that are not bundled.
Default Values of Properties
maximumDuration | <code>0x7FFFFFFF</code> | The bundling algorithm runs unrestricted. |
Type Details
- yfiles module
- router-other
- yfiles-umd modules
- layout-familytree, layout-multipage, layout-orthogonal-compact, layout, router-bus, router-other
- Legacy UMD name
- yfiles.router.EdgeBundlingStage
See Also
0.4
is recommended. On the other hand, using zero values for the bundling strength or the bundling quality leads to straight-line edges.Constructors
Creates a new EdgeBundlingStage instance with the given optional core layout algorithm and default settings.
Parameters
A map of options to pass to the method.
- core - ILayoutAlgorithm
- the core layout algorithm
Properties
Gets or sets the core layout algorithm that is wrapped by this stage.
Gets the EdgeBundling instance that defines the settings of the edge bundling feature.
Remarks
The specified EdgeBundling defines global bundling properties. Settings for individual edges can be defined by assigning an EdgeBundleDescriptor to an edge using a IDataProvider registered with key EDGE_BUNDLE_DESCRIPTOR_DP_KEY.
By default, all edges are bundled (property bundled of the default bundle descriptor is enabled). The default for bundlingStrength is 0.4
and the default for property bundlingQuality is 1.0
.
Gets or sets the maximum duration in milliseconds that this bundling algorithm is allowed to run.
Remarks
Default Value
<code>0x7FFFFFFF</code>
.The bundling algorithm runs unrestricted.
Throws
- Exception({ name: 'ArgumentError' })
- if the specified duration has a negative value
Methods
Applies the edge bundling algorithm after invoking the core layout algorithm.
Parameters
A map of options to pass to the method.
- graph - LayoutGraph
- the input graph
See Also
Implements
Invokes the layout process of the core layout algorithm.
Remarks
Parameters
A map of options to pass to the method.
- graph - LayoutGraph
- the input graph