Dojo Diagrammer: link layouts for nested graphs decrypted
AdrianVasiliu 270002HS2B Visits (2520)
As mentioned in previous blog posts (for instance Displaying attractive diagrams: quick hints for choosing a graph layout algorithm from Dojo Diagrammer), Dojo Diagrammer provides a comprehensive set of layout algorithms for laying out nodes and links in graphs. In the present post I will provide more in-depth information that may help for configuring the link layout in a tricky case of graphs: nested graphs. Nested graphs are graphs where nodes contain another graph, as opposed to flat graphs which do not contain other graphs. An example of nested graph:
In Dojo Diagrammer, there are several ways to get the links laid out. Link layouts can be performed by:
All these algorithms can be applied to flat or nested graphs. The case of nested graph is the trickiest, mostly because of two reasons:
To deal with intergraph links, the node layouts such as TreeLayout, CircularLayout, and ForceDirectedLayout need to be combined with a link layout (ShortLinkLayout or LongLinkLayout) configured such that it only lays out the intergraph links, while the regular links are laid out by the node layout:
Remains the happy case of HierarchicalLayout. This node layout is the only one that is able to handle intergraph links by itself, and to optimize the layout for the entire nested graph. That is, for laying out nested graphs using Hierarchical, the configuration is much simpler: you only need to set the Hierarchical as node layout. No link layout is needed.
This feature of HierarchicalLayout is enabled by default. It can be disabled (but in this case do not forget to combine it with a link layout for intergraph links in nested graphs):
Note for users of Dojo Diagrammer 1.0: this feature is new in Dojo Diagrammer 1.1.
For comparison, here is the same graph laid out using only HierarchicalLayout with the recursive mode enabled (which is the default mode):
Besides the simplification of the layout configuration (no need to combine the node layout with a link layout), the recursive mode of HierarchicalLayout provides a better quality. As you can see by comparing the two screenshots above, the number of link crossings is smaller, and the links are laid out in a more uniform manner, pointing from left to right (the direction of the hierarchical flow). This is the benefit of the global optimization of the layout for the entire nested graphs.
In summary, the rules of thumb for laying out nested graphs: