Skip to main content

SliceAndDiceLayoutAlgorithm Class

A class representing the Slice and Dice layout algorithm.

Namespace: DevExpress.Xpf.TreeMap

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

NuGet Package: DevExpress.Wpf.TreeMap

Declaration

public class SliceAndDiceLayoutAlgorithm :
    TreeMapLayoutAlgorithm

Remarks

This algorithm calculates the layout using the following principle. For each tree map level the layout direction is selected depending on the width/height ratio (for SliceAndDiceLayoutAlgorithm.LayoutMode = SliceAndDiceLayoutMode.Auto), and for all children items at a given level, the display area is divided amongst the children, where each child item obtains a slice proportional to its value.

The following image demonstrates the country area tree map with a layout calculated using this algorithm.

SliceAndDiceLayoutAlgorithm

Example

To customize the layout algorithm, do the following.

<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>
See Also