ICustomPointColorizer Interface

An interface that should be implemented by a class that defines a custom point colorizer for a point, bar, line, area or range area series.

Namespace: DevExpress.Maui.Charts

Assembly: DevExpress.Maui.Charts.dll

NuGet Package: DevExpress.Maui.Charts

Declaration

public interface ICustomPointColorizer :
    IPointColorizer

Example

In this example, the bar chart displays monthly values colored based on the season.

1. Create a data source – a list of objects that define data points with date-time arguments and numeric values.

2. Create a colorizer class (CustomColorizer in this example) that implements the ICustomPointColorizer interface.
   Implement the GetColor method to return a data point’s color based on a ColoredPointInfo object passed as the method’s parameter. Use the ColoredPointInfo.DateTimeArgument property to obtain the data point’s argument value.

   C#

   using System;
   using Microsoft.Maui.Controls;
   using Microsoft.Maui.Graphics;
   using System.Collections.Generic;
   using DevExpress.Maui.Charts;
   
   namespace ColorizerExample {
       public class ViewModel {
           public List<DataItem> Data { get; }
   
           public ViewModel() {
               Data = new List<DataItem>() {
                   new DataItem() { Argument = new DateTime(2020, 1, 1), Value = 3 },
                   new DataItem() { Argument = new DateTime(2020, 2, 1), Value = 5 },
                   new DataItem() { Argument = new DateTime(2020, 3, 1), Value = 7 },
                   new DataItem() { Argument = new DateTime(2020, 4, 1), Value = 2 },
                   new DataItem() { Argument = new DateTime(2020, 5, 1), Value = 6 },
                   new DataItem() { Argument = new DateTime(2020, 6, 1), Value = 4 },
                   new DataItem() { Argument = new DateTime(2020, 7, 1), Value = 1 },
                   new DataItem() { Argument = new DateTime(2020, 8, 1), Value = 8 },
                   new DataItem() { Argument = new DateTime(2020, 9, 1), Value = 3 },
                   new DataItem() { Argument = new DateTime(2020, 10, 1), Value = 9 },
                   new DataItem() { Argument = new DateTime(2020, 11, 1), Value = 4 },
                   new DataItem() { Argument = new DateTime(2020, 12, 1), Value = 7 },
               };
           }
       }
   
       public class DataItem {
           public DateTime Argument { get; set; }
           public double Value { get; set; }
       }
   
       public class CustomColorizer : ICustomPointColorizer {
           Color ICustomPointColorizer.GetColor(ColoredPointInfo info) {
               switch (info.DateTimeArgument.Month) {
                   case 12:
                   case 1:
                   case 2:
                       return Color.FromHex("#5982db");
                   case 3:
                   case 4:
                   case 5:
                       return Color.FromHex("#755dd9");
                   case 6:
                   case 7:
                   case 8:
                       return Color.FromHex("#9b57d3");
                   case 9:
                   case 10:
                   case 11:
                       return Color.FromHex("#92278f");
                   default:
                       return Color.Default;
               }
           }
           public ILegendItemProvider GetLegendItemProvider() {
               return null;
           }
       }
   }
   

3. Assign a CustomColorizer object to the BarSeries.PointColorizer property.

   XAML

   <ContentPage
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       xmlns:dxc="clr-namespace:DevExpress.Maui.Charts;assembly=DevExpress.Maui.Charts"
       xmlns:local="clr-namespace:ColorizerExample"
       x:Class="ColorizerExample.MainPage">
       <ContentPage.BindingContext>
           <local:ViewModel />
       </ContentPage.BindingContext>
       <dxc:ChartView>
           <dxc:ChartView.Series>
               <dxc:BarSeries PointColorizer="{local:CustomColorizer}">
                   <!-- Bind the series to the data source. -->
                   <dxc:BarSeries.Data>
                       <dxc:SeriesDataAdapter DataSource="{Binding Data}" 
                                              ArgumentDataMember="Argument">
                           <dxc:ValueDataMember Member="Value" Type="Value" />
                       </dxc:SeriesDataAdapter>
                   </dxc:BarSeries.Data>
               </dxc:BarSeries>
           </dxc:ChartView.Series>
           <dxc:ChartView.AxisX>
               <dxc:DateTimeAxisX MeasureUnit="Month" /> 
           </dxc:ChartView.AxisX>
       </dxc:ChartView>
   </ContentPage>