Orthogonal Layout

Class OrthogonalLayouter is a multi-purpose layout provider for undirected graphs. It produces clear representations of complex networks and is especially fit for application areas such as

The orthogonal layout algorithm is based on the topology-shape-metrics approach and consists of three phases. In the first phase the edge crossings in the drawing are calculated. The second phase computes the bends in the drawing, in the third phase the final coordinates are determined.

The layout algorithm is well suited for medium-sized sparse graphs. It produces compact drawings with no overlaps, few crossings, and few bends.

Figure 5.46. Sample layouts produced by class OrthogonalLayouter

Sample layouts produced by class OrthogonalLayouter
Sample layouts produced by class OrthogonalLayouter
UML class diagram representing a part of the layout interface of yFiles. This diagram shows finite state automaton from an industrial application.

Supplemental Layout Data

Class OrthogonalLayouter knows a number of data provider keys which are used to retrieve supplemental layout data for a graph's elements. The data is bound to the graph by means of a data provider, which is registered using a given look-up key. Table 5.23, “Data provider look-up keys” lists all look-up keys for OrthogonalLayouter.

Binding supplemental layout data to a graph is described in the section called “Providing Supplemental Layout Data”.

Table 5.23. Data provider look-up keys

Key Element Type Value Type Description
EDGE_LABEL_LAYOUT_KEY Edge LabelLayoutData[] For each edge an array of LabelLayoutData objects that encode size and preferred placement for all labels of the edge.

Layout Options

Layout Style (see API)

Normal
Node sizes will not be changed by this layouter. The drawing will contain very few bends only.
Normal + Tree
Same as "Normal," but larger subtrees are processed using a specialized tree layout algorithm, which is better suited for tree-like structures than the original orthogonal layout style.
Uniform Node Sizes
All node sizes will be changed to equal size before the graph is processed.
Node Boxes
Nodes are resized according to the number and position of their neighbors to reduce the overall number of bends.
Mixed
Resembles "Node Boxes," but resizes all nodes to equal size. Introduces additional bends and routes the last edge segment of these edges non-orthogonally to their adjacent nodes.
Mixed (Size Fixed)
Proceeds similar to layout style "Mixed," but maintains original node sizes.
Node Boxes (Size Fixed)
Proceeds similar to layout style "Node Boxes," but maintains original node sizes.

Figure 5.47. Sample layouts for the available orthogonal layout styles

Grid (see API)

Defines the virtual grid spacing used by the layout algorithm. Each node will be placed in such a way that its center point lies on a grid point. Edges will be routed in such a way that their segments lie on grid lines, if the terminal nodes of the edges allow to place the ports accordingly. Note that this option is only guaranteed to be obeyed for "Normal Layout Style," for all other styles it is used as a hint only.

Length Reduction (see API)

If enabled, the overall edge lengths will be reduced. The cost for the reduction is an increased execution time of the layout algorithm.

Optimize Perceived Bends (see API)

If enabled, avoids helical arrangement of chains of nodes.

Use Existing Drawing as Sketch (see API)

If enabled, the layout algorithm will interpret the initial graph layout as a sketch of the resulting orthogonal layout. The layout algorithm tries to "orthogonalize" the given sketch without making too much modifications in respect to the original drawing.

Crossing Postprocessing (see API)

If enabled, the overall number of edge crossings will be reduced. The cost for the reduction is increased execution time of the layouter.

Use Randomization (see API)

If enabled, the overall layout quality will increase with high probability. The cost for this layout optimization is increased execution time and non-deterministic results for subsequent layout invocations.

Advanced Layout Features

Integrated Labeling

Besides the general labeling support as described in the section called “General Labeling”, which is available with all yFiles layout algorithms, the orthogonal layout algorithm additionally features integrated labeling. Integrated labeling is available for edge labels and can be used in conjunction with layout style "Normal." It takes the edge labels into consideration when determining both node placement and edge path generation. With this strategy it is guaranteed that no edge label will overlap other objects in the diagram.

To specify size and preferred placement of edge labels when using integrated labeling, a data provider holding such supplemental layout data must be bound to the graph. The data provider is expected to be registered with the graph using key EDGE_LABEL_LAYOUT_KEY.

Enabling integrated labeling with OrthogonalLayouter and using the services of class LabelLayoutTranslator to conveniently have such a data provider created and bound to the graph is described in the section called “Integrated Labeling”.

Orthogonal Layout of Hierarchically Organized Graphs

See the section called “Orthogonal Layout of Hierarchically Organized Graphs” on how to calculate an orthogonal style layout with hierarchically organized graphs.

Tutorial Demo Code

Layout module OrthogonalLayoutModule.java presents the setup of class OrthogonalLayouter in an application context.

Configuration Hints

Quality Versus Time

The running time of orthogonal layout can be reduced by disabling some of the optimization settings.

For example, turning off the "Crossing Postprocessing" option can have a substantial effect on the run-time, especially when the graph has many edge crossings. Disabling further settings, like, e.g., "Optimize Perceived Bends," or "Length Reduction" also reduces execution time.