How to: Implement a Custom Colorizer

Jun 07, 2019
2 minutes to read

To implement the custom colorizer, inherit the TreeMapColorizerBase or its descendant class, and override the TreeMapColorizerBase.GetItemColor method. Sent as parameters, the TreeMapItem and TreeMapItemGroupInfo objects contain all the required information to colorize items.

CustomColorizer.vb
MainWindow.xaml
CustomColorizer.cs

Imports DevExpress.Xpf.TreeMap
Imports System.Windows.Media

Namespace CustomColorizerSample
    Friend Class CustomColorizer
        Inherits TreeMapPaletteColorizerBase

        Public Overrides Function GetItemColor(ByVal item As TreeMapItem, ByVal group As TreeMapItemGroupInfo) As Color?
            If item.Children.Count = 0 Then
                Dim itemColor As Color = Palette(group.ItemIndex Mod Palette.Count)
                Dim groupColor As Color = Palette(group.GroupIndex Mod Palette.Count)
                Dim proportion As Double = (item.Value - group.MinValue) / (group.MaxValue - group.MinValue)

                Return New Color With {.A = 255, .R = CByte(proportion * itemColor.R + (1-proportion)*groupColor.R), .G = CByte(proportion * itemColor.G + (1 - proportion) * groupColor.G), .B = CByte(proportion * itemColor.B + (1 - proportion) * groupColor.B)}
            Else
                Return Palette(Palette.Count - 1 - group.GroupLevel Mod Palette.Count)
            End If
        End Function

        Protected Overrides Function CreateObject() As TreeMapDependencyObject
            Return New CustomColorizer()
        End Function
    End Class
End Namespace

xaml

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:CustomColorizerSample"
        xmlns:dxtm="http://schemas.devexpress.com/winfx/2008/xaml/treemap" x:Class="CustomColorizerSample.MainWindow"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <dxtm:TreeMapControl>
            <dxtm:TreeMapControl.Colorizer>
                <local:CustomColorizer>
                    <local:CustomColorizer.Palette>
                        <dxtm:Office2013Palette/>
                    </local:CustomColorizer.Palette>
                </local:CustomColorizer>
            </dxtm:TreeMapControl.Colorizer>
            <dxtm:TreeMapItemStorage>
                <dxtm:TreeMapItem Label="Americas">
                    <dxtm:TreeMapItem Label="United States"
                                      Value="11384763"/>
                    <dxtm:TreeMapItem Label="Brazil"
                                      Value="1799612"/>
                    <dxtm:TreeMapItem Label="Canada"
                                      Value="1572781"/>
                </dxtm:TreeMapItem>
                <dxtm:TreeMapItem Label="Europe">
                    <dxtm:TreeMapItem Label="Germany"
                                      Value="3371003"/>
                    <dxtm:TreeMapItem Label="United Kingdom"
                                      Value="2582021"/>
                    <dxtm:TreeMapItem Label="France"
                                      Value="2422649"/>
                    <dxtm:TreeMapItem Label="Italy"
                                      Value="1809047"/>
                </dxtm:TreeMapItem>
                <dxtm:TreeMapItem Label="Asia">
                    <dxtm:TreeMapItem Label="China"
                                      Value="17968195"/>
                    <dxtm:TreeMapItem Label="Japan"
                                      Value="4116242"/>
                    <dxtm:TreeMapItem Label="India"
                                      Value="2864903"/>
                </dxtm:TreeMapItem>
            </dxtm:TreeMapItemStorage>
        </dxtm:TreeMapControl>
    </Grid>
</Window>

csharp

using DevExpress.Xpf.TreeMap;
using System.Windows.Media;

namespace CustomColorizerSample {
    class CustomColorizer : TreeMapPaletteColorizerBase {
        public override Color? GetItemColor(TreeMapItem item, TreeMapItemGroupInfo group) {
            if (item.Children.Count == 0) {
                Color itemColor = Palette[group.ItemIndex % Palette.Count];
                Color groupColor = Palette[group.GroupIndex % Palette.Count];
                double proportion = (item.Value - group.MinValue) / 
                        (group.MaxValue - group.MinValue);

                return new Color {
                    A = 255,
                    R = (byte)(proportion * itemColor.R + (1-proportion)*groupColor.R),
                    G = (byte)(proportion * itemColor.G + (1 - proportion) * groupColor.G),
                    B = (byte)(proportion * itemColor.B + (1 - proportion) * groupColor.B)
                };
            }
            else
                return Palette[Palette.Count - 1 - group.GroupLevel % Palette.Count];
        }

        protected override TreeMapDependencyObject CreateObject() {
            return new CustomColorizer();
        }
    }
}