Nevron Open Vision Documentation
Layouts Overview

 
About Layouts

NOV Diagram for .NET features strong support for automatic tree and graph layouts. Although the layouts are mainly designed to work with diagram shapes they can virtually operate with other types of objects.

The layouts you can use to arrange drawings are located in two namespaces:

Nevron.Nov.Layout - contains box layouts that help you arrange 2D shapes in stack, wrap flow, dock etc. ways. These layouts are also used by NOV UI. Take a look at the Layouts Overview for a brief overview of the core layout features.

Nevron.Nov.Diagram.Layout - contains tree and graph layouts that are specific to the NOV Diagram for .NET product.

Performing Layouts

Since all types of layouts derive from base NLayout class, this class defines a common and easy way to apply a layout to a certain set of objects. This is performed by its Layout method.

As input this method takes only two arguments - a list of objects, which must be arranged and a layout context instance. The following example demonstrates how to apply a layout to items of a drawing document active page.

Layout the Shapes inside the Active Page
Copy Code
// TODO: get a reference to the drawing document
NDrawingDocument drawingDocument;
// get the active page
NPage activePage = drawingDocument.Content.ActivePage;
// create the layout area (in this case the active page content edge
NRectangle layoutArea = activePage.GetContentEdge();
// create a layout context that arranges shapes inside the specified layout area
NDrawingLayoutContext layoutContext = new NDrawingLayoutContext(drawingDocument, layoutArea);
// get the objects to arrange (in this case all page items)
NList<object> objects = activePage.Items.GetChildren().CastAll<object>();
// create the layout (in this case NLayeredGraphLayout)
NLayout layout = new NLayeredGraphLayout();
// layout the objects in the specified context
layout.Arrange(objects, layoutContext);
Summary of Tree Layouts

The following table outlines the tree layouts implemented by NOV Diagram for .NET.

Layout Description
Layered Tree Layout Layouts the tree vertices in layers. Supports breadth compaction, layer alignment, straight and orthogonal edge routing, layer and vertex spacing etc. Supports layout direction (e.g. left-to-right, top-to-bottom etc.)
Compact Depth Tree Layout The depth arrangement of the vertices is as compact as possible. Supports breadth compaction, straight and orthogonal edge routing, parent-child spacing etc. Supports layout direction (e.g. left-to-right, top-to-bottom etc.)
Tip - Over Tree Layout Layouts the children vertices of a parent vertex in either a single row or a single column. The children arrangement can be specified on a per vertex basis. Supports overall compaction, horizontal and vertical spacing etc.
Balloon Tree Layout Layouts the children vertices in a single circle around its parent vertex. Automatically resolves overlaps. Can be constrained to place the children vertices in a polar angular range.

Summary of Graph Layouts

The following table outlines the graph layouts implemented by NOV Diagram for .NET.

Layout Description
Barycenter Layout Force directed layout, which splits the input graph vertices in two distinct sets - fixed and free vertices. Fixed vertices are placed at the corners of a strictly convex polygon. Free vertices are then placed in the center of their mass (barycenter).
Spring Layout Force directed layout, which uses a spring force and electrical force couple. The spring force tries to enforce a certain distance between connected vertices. The electrical force repels the vertices which are close to each other.
Symmetrical Layout Force directed layout, which aims to make the edge lengths equals in size and also repels vertices which are close to each other.
Layered Graph Layout Hierarchical graph layout, which first distributes the graph vertices to layers. Then it tries to minimize the edge crossings on a layer by layer basis. Finally the layout performs the breadth vertex placement and edge routing step. Supports both polyline and orthogonal edge routings.
Orthogonal Layout Produces orthogonal graph drawings, which satisfy a number of aesthetic criterias including: minimal number of edge crossings, minimal number of edge bends, compactness etc.
Radial Graph Layout Layouts graphs in concentric circles. The vertices with no predecessors are placed in the center and their descendants are placed on the next circle and so on. It produces a straight line graph drawing.
Single Cycle Graph Layout Layouts all graph vertices on a single circle, trying to minimize the number of edge crossings. Produces a straight line graph drawing.

Send Feedback