Graph Layout

A graph is displayed in the base window after a term representation has loaded from file. In a hierarchical layout, nodes of the same hierarchy layer are assigned to one horizontal level so all edges point downwards. Edges passing more than one level ("long span edges") are filled up with dummy nodes at each passed level. Dummy nodes are not part of the term representation, they are introduced automatically. Usually, they are invisible, but highlighted with small bullets when the corresponding edge is selected or when they are touched by the mouse pointer.

After loading a graph, a simple layout is applied without processing the edge crossing reduction. This means that all child nodes of a graph are placed in the initial order found in the term representation. A layout algorithm is available to reduce the number of edge crossings, resulting in better layouts. For large graphs, this edge crossing reduction can be a lengthy operation, so it always has to be started by the user with menu Layout/Improve All. The edge crossing reduction calculates a new graph layout with (probably) fewer edge crossings by rearranging the order of nodes at each level. This graph layout algorithm has a random component, so two layout calculations of the same graph may yield different results. The advantage of this technique is that the average number of edge crossings is usually smaller.

Using menu Layout/Orientation it is possible to set the direction of a graph layout. The default orientation is top-down to get horizontal levels and edges pointing downwards. The other three layout orientations left-to-right, right-to-left and bottom-up can be optionally set with the menu.

After calculating the layout, the graph is drawn in the base window. The visualization of nodes and edges (e.g. font, color, shape, icon, line pattern, etc) is determined by their attributes in the term representation. A text string, taken from attribute OBJECT, is placed inside each node. The size of the nodes is automatically adapted to match the actual extension of the text. Multi-line text including newline characters is also supported. For the layout the minimal distance between nodes at the same level and the distance between levels (called gap width and height) can be set with menu Options/Layout Settings....

Selection

If a node is selected by the user with the mouse, it will be drawn with a shadow. Many nodes can be selected at a time using the SHIFT-key or with a rubber band selection. Edges can be selected, too, but only one at a time (i.e. multiple selection for edges is currently not possible). Edge selection is a useful trick to trace the route and find the parent and child node of very long edges.

Incremental Graph Layout

If the layout algorithm (edge crossing reduction) is started with menu Layout/Improve All, uDraw(Graph) optimizes the overall layout of the graph. Due to the basic principles of these algorithms, even minimal changes to a graph structure result in major changes in the layout. To overcome this problem, uDraw(Graph) has a unique incremental graph layout algorithm to introduce updates in a graph with a minimal number of modifications.

Graph updates sent to the uDraw(Graph) API are inserted into the existing graph layout incrementally instead of forcing a completely new layout. So the layout before the update is preserved as much as possible in order to support layout stability. Of course, after doing some incremental updates, the graph layout may be getting worse, so a new global graph layout might be necessary. The user can do this at any time with menu Layout/Improve All.

Next: Visualization Definition.