Version

Node Arrangement Settings

The xamOrgChart™ control has settings, which affect the arrangement of its nodes. They are:

Node Arrangement Strategy

The Node Arrangement Strategy determines the way that the xamOrgChart nodes are going to be arranged.

  • Stagger – produces the most compact arrangement of the nodes. It is suitable for large sets of data.

    xamOrgChart Node Arrangement Settings 01.png

  • Orthogonal – produces a well-arranged org chart. It is suitable for small sets of data.

    xamOrgChart Node Arrangement Settings 02.png

Node Flow Direction

The node flow direction determines the position of the child nodes relative to their parent. The directions can be:

  • Above (child above the parent, bottom-to-top flow direction)

    xamOrgChart Node Arrangement Settings 03.png

  • Bellow (child underneath the parent, top-to-bottom flow direction)

    xamOrgChart Node Arrangement Settings 04.png

  • Left (child on the left of the parent, right-to-left flow direction)

    xamOrgChart Node Arrangement Settings 05.png

  • Right (child on the right of the parent, left-to-right flow direction)

    xamOrgChart Node Arrangement Settings 06.png

Horizontal and Vertical Node Buffers

The Horizontal and Vertical Node Buffers control the minimum spacing between the nodes. The following screenshot shows a schematic representation of horizontal and vertical node buffers:

xamOrgChart Node Arrangement Settings 07.png
Note
Note:

Horizontal and Vertical Node Buffers can be also set on an OrgChartNodeLayout object – this will override the global node buffers.

In XAML:

<ig:OrgChartNodeLayout
    HorizontalNodeBuffer="50"
    VerticalNodeBuffer="50">
</ig:OrgChartNodeLayout>

Code Examples

In XAML:

<ig:XamOrgChart
    NodeArrangementStrategy="Orthogonal"
    NodeFlowDirection="Above"
    HorizontalNodeBuffer="50"
    VerticalNodeBuffer="50">
</ig:XamOrgChart>

In Visual Basic:

Dim orgChart As  XamOrgChart = New XamOrgChart()
orgChart.NodeArrangementStrategy = NodeArrangementStrategy.Orthogonal
orgChart.NodeFlowDirection = NodeFlowDirection.Above
orgChart.HorizontalNodeBuffer = 50
orgChart.VerticalNodeBuffer = 50

In C#:

XamOrgChart orgChart = new XamOrgChart();
orgChart.NodeArrangementStrategy = NodeArrangementStrategy.Orthogonal;
orgChart.NodeFlowDirection = NodeFlowDirection.Above;
orgChart.HorizontalNodeBuffer = 50;
orgChart.VerticalNodeBuffer = 50;

Related Topics

Using xamOrgChart