TreeMapLayoutAlgorithm.Direction Property

Gets or sets the layout fill direction used by the algorithm.

Namespace: DevExpress.Xpf.TreeMap

Assembly: DevExpress.Xpf.TreeMap.v19.1.dll

Declaration

C#

public LayoutDirection Direction { get; set; }

VB.NET

Public Property Direction As LayoutDirection

Property Value

Type	Description
LayoutDirection	A LayoutDirection enumeration value.

Available values:

Name	Description
TopLeftToBottomRight	Items are arranged from the top-left angle to the bottom-right angle.
BottomLeftToTopRight	Items are arranged from the bottom-left angle to the top-right angle.
TopRightToBottomLeft	Items are arranged from the top-right angle to the bottom-left angle.
BottomRightToTopLeft	Items are arranged from the bottom-right angle to the top-left angle.

Remarks

For instance, for the LayoutDirection.TopLeftToBottomRight value, the largest tree map item will be arranged at the top left corner and the smallest item will be placed at the bottom right corner.

Example

To customize the layout algorithm, do the following.

• Assign a newly created TreeMapLayoutAlgorithmBase class descendant object to the TreeMapControl.LayoutAlgorithm property.
• Optionally, for all predefined layout algorithms, it is possible to specify a layout’s fill direction using the TreeMapLayoutAlgorithm.Direction property.
• In addition to the layout direction, for the SliceAndDiceLayoutAlgorithm you can change its mode using the SliceAndDiceLayoutAlgorithm.LayoutMode property.

Note

A complete sample project is available at https://github.com/DevExpress-Examples/how-to-change-the-layout-algorithm-used-by-treemap-t308988.

MainWindow.xaml

<dxtm:TreeMapControl x:Name="treeMap"
                     LayoutAlgorithm="{Binding ElementName=lbLayoutAlgorithm, Path=SelectedValue}">
    <!-- endregion #LayoutAlgorithm-->
    <dxtm:TreeMapControl.Colorizer>
        <dxtm:TreeMapPaletteColorizer/>
    </dxtm:TreeMapControl.Colorizer>
    <dxtm:TreeMapItemStorage>
        <dxtm:TreeMapItem Label="Americas">
            <dxtm:TreeMapItem Label="United States" Value="17.418"/>
            <dxtm:TreeMapItem Label="Brazil" Value="2.353"/>
        </dxtm:TreeMapItem>
        <dxtm:TreeMapItem Label="Europe">
            <dxtm:TreeMapItem Label="Germany" Value="3.859"/>
            <dxtm:TreeMapItem Label="United Kingdom" Value="2.945"/>
            <dxtm:TreeMapItem Label="France" Value="2.846"/>
            <dxtm:TreeMapItem Label="Italy" Value="2.147"/>
            <dxtm:TreeMapItem Label="Russia" Value="1.857"/>
        </dxtm:TreeMapItem>
        <dxtm:TreeMapItem Label="Asia">
            <dxtm:TreeMapItem Label="China" Value="10.380"/>
            <dxtm:TreeMapItem Label="Japan" Value="4.616"/>
            <dxtm:TreeMapItem Label="India" Value="2.049"/>
        </dxtm:TreeMapItem>
    </dxtm:TreeMapItemStorage>
    <!--region #CloseTag-->
</dxtm:TreeMapControl>
<!--endregion #CloseTag-->
<Grid Grid.Column="1" Margin="4">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <TextBlock Grid.Row="0" 
               Margin="0,0,0,4"
               Text="Layout Algorithm:"/>
    <!--region #LayoutAlgorithmList-->
    <ListBox x:Name="lbLayoutAlgorithm"
             Grid.Row="1"
             DisplayMemberPath="LayoutAlgorithmName"
             SelectedValuePath="LayoutAlgorithm"
             SelectedIndex="0">
        <local:LayoutAlgorithmWarapper LayoutAlgorithmName="Slice and Dice">
            <dxtm:SliceAndDiceLayoutAlgorithm/>
        </local:LayoutAlgorithmWarapper>
        <local:LayoutAlgorithmWarapper LayoutAlgorithmName="Squarified">
            <dxtm:SquarifiedLayoutAlgorithm/>
        </local:LayoutAlgorithmWarapper>
        <local:LayoutAlgorithmWarapper LayoutAlgorithmName="Striped">
            <dxtm:StripedLayoutAlgorithm/>
        </local:LayoutAlgorithmWarapper>
    </ListBox>