Laying Out Diagrams Automatically
Applications that process hierarchical or more complex entity-relationship data might need to present that data to end-users in an aesthetical and visually appealing manner. Such applications would store their data as graph of linked nodes possibly having additional information attached to them. However, position and size coordinates of nodes might be unnecessary and/or unavailable. FlowChartX provides methods to automatically arrange the nodes and links of a diagram, applying attractive layouts on the overall structure of the diagram. To utilize that functionality an application can create a diagram by assigning generic coordinates to its nodes and invoke the ArrangeDiagram method of the FlowChart class.
If application's data is structured hierarchically, it is appropriate to apply tree layout on it. To do this call ArrangeDiagram, passing a TreeLayout structure instance as an argument. Members of that structure control many aspects of the layout process. You can choose how much space to leave between tree levels and between nodes on the same level. The style of links in the arranged tree can be set to straight, orthogonal or curved. Global tree direction and alignment can be customized too. Using Visual Basic tree layout might be applied like this:
VB
 Copy Code
|
|---|
Dim layout As New TreeLayout |
Spring-Embedder is force-directed layout algorithm. It simulates a physical system in which nodes repulse each other, and the links between them act as confining springs. Graphs processed by Spring-Embedder have their nodes distributed uniformly across the diagram area. The algorithm can be applied on a graph by calling the ArrangeDiagram method, passing a SpringLayout structure instance as an argument. Members of that structure allow you to set the desired distance between graph nodes and the number of iteration steps to use while calculating node positions. You can also specify that FlowChartX should try to minimize arrow crossings. If you select that option, the algorithm would produce better result with more iteration steps. However, it needs more time to complete if more steps are specified. Using Visual Basic Spring-Embedder layout might be applied like this:
| VB
Copy Code
|
|---|
Dim layout As New SpringLayout |
a feature of FlowChartX Pro edition
FractalLayout is a tree layout algorithm that places child nodes symmetrically around their parent node. Nodes at the lowest level are arranged directly in a circle around their parent. At upper levels, the already arranged nodes form branches that are arranged in a circle around the new parent node. The algorithm is recursively repeated till the highest level is reached. If nodes in the tree have uniform number of children, the end result has fractal-like appearance (subsets of the graph look like scaled-down copies of the whole graph).
You can choose which node should be displayed at the center of the topmost circle by setting the Root property. If it is not specified, the algorithm automatically selects a root that leads to more balanced distribution of nodes.
( a feature of FlowChartX Pro edition)
The LayeredLayout algorithm arranges graphs nodes in layers according to several criteria, most important of which are: connected nodes must be placed close together; arrows must flow in one direction if possible; arrows must cross as few layers as possible; arrows must not cross other arrows. To apply the layout to a diagram, create a LayeredLayout instance, set its members and pass it to ArrangeDiagram method. Using Visual Basic layered layout can be applied like this:
| VB
Copy Code
|
|---|
Dim layout As New LayeredLayout |
( a feature of FlowChartX Pro edition)
The GridLayout algorithm arranges diagram nodes in a grid, keeping connected nodes close together. The algorithm strives to achieve a small number of arrow crossings. It is based on an iterative process whose initial steps shuffle the grid nodes randomly. That can lead to very different results each time the algorithm is run. To apply the layout to a diagram, create a GridLayout instance, set its members and pass it to the ArrangeDiagram method. In Visual Basic grid layout can be applied like this:
| VB
Copy Code
|
|---|
Dim layout As New GridLayout |
( a feature of FlowChartX Pro edition)
CircularLayout distributes nodes evenly on the circumference of a circle at positions that result in as few link crossing as possible. Set its Radius property to specify the size of the layout circle. Use SiftingRounds to set the number of fine-tuning crossing-reduction iterations. To apply the layout to a diagram, create a CircularLayout instance, set its members and pass it to the ArrangeDiagram method. In Visual Basic circular layout can be applied like this:
| VB
Copy Code
|
|---|
Dim layout As New CircularLayout |
( a feature of FlowChartX Pro edition)
The AnnealLayout class implements the Simulated Annealing graph layout algorithm. Simulated Annealing is a general-purpose optimization method used to solve large-scale combinatorial problems by simulating the process of heating and cooling of metal to achieve freedom from defects. Finding a nice arrangement of a graph is a combinatorial problem that can be reduced to assigning costs to graph configurations and finding the minimum cost configuration. AnnealLayout assigns costs to graph configurations by evaluating different aesthetic criteria such as distance between nodes, length of links and the number of link crossings. Thus the best configuration found will have good aesthetic properties.
( a feature of FlowChartX Pro edition)
DecisionLayout arranges simple flowcharts consisting of decision boxes with up to three outgoing links per node and activity boxes with a single outgoing link per node. The nodes are arranged in columns and rows, whose distance depends on the HorizontalPadding and VerticalPadding property values. When links share the same row or column, they are placed at a distance specified via LinkPadding. The layout arranges nodes recursively starting from StartNode. If StartNode is not specified, the algorithm selects the root of the deepest branch of the graph's spanning tree as start node.
( a feature of FlowChartX Pro edition)
Tree maps represent hierarchies by nesting child nodes within their parents, where the areas of leaf nodes are proportional to their Weight values. Unlike other layout algorithms, TreeMapLayout expects hierarchies to be defined via grouping or containment (see AttachTo method and bsContainer nodes), and will ignore any links in the diagram. The diagram area covered by the topmost nodes in a hierarchy is specified via the SetLayoutArea method. By default, the layout tries to keep the ratio of node sides as close as possible to one. However this could make it hard to distinguish separate levels of the hierarchy. To alleviate that, set Squarify to false, and child nodes will be arranged either as a row or a column inside their parent node, alternating directions for each level. The drawback is that when Weight ratios differ greatly or nodes contain many children, some nodes could end up with very narrow rectangles.
