ColorDataAdapter Class

Retrieves point colors and their legend item descriptions from data source fields.

Assembly: DevExpress.Maui.Charts.dll

NuGet Package: DevExpress.Maui.Charts

Declaration

public class ColorDataAdapter :
    DataSourceAdapterBase,
    ICustomPointColorizer,
    IPointColorizer,
    ILegendItemProvider

Remarks

You can specify a series point colorizer based on colors stored in a data source. To do this:

Assign a ColorDataAdapter object to the PointColorizer property of a series.
Use the adapter’s properties to define the data source and its fields that contain point colors and their text descriptions for legend items.

Example

In this example, the bar chart visualizes GDP values for the G20 and paints bars with colors from the specified field of the data source. Legend items obtain descriptions for these colors from another field.

Color Data Adapter

Create a data source – a list of objects each of which stores a country’s name, GDP value, region (the part of the world where the country is located), and color for this region.

using Microsoft.Maui.Controls;
using Microsoft.Maui.Graphics;
using System.Collections.Generic;

namespace ColorizerExample {
    public class ViewModel {
        CountryStatisticsData data = new CountryStatisticsData();
        public List<CountryStatistics> CountryStatisticsData => this.data.SeriesData;
    }

    public class CountryStatisticsData {
        readonly List<CountryStatistics> data = new List<CountryStatistics> {
            new CountryStatistics("Argentina", 16011.6728032264, "America", Color.FromHex("9d419c")),
            new CountryStatistics("Australia", 38159.6336533223, "Australia", Color.FromHex("36a3a6")),
            new CountryStatistics("Brazil", 11210.3908053823, "America", Color.FromHex("9d419c")),
            new CountryStatistics("Canada", 39050.1673163719, "America", Color.FromHex("9d419c")),
            new CountryStatistics("China", 7599, "Asia", Color.FromHex("70c92f")),
            new CountryStatistics("France", 34123.1966249035, "Europe", Color.FromHex("cc3836")),
            new CountryStatistics("Germany", 37402.2677660974, "Europe", Color.FromHex("cc3836")),
            new CountryStatistics("India", 3425.4489267524, "Asia", Color.FromHex("70c92f")),
            new CountryStatistics("Indonesia", 4325.2533282173, "Asia", Color.FromHex("70c92f")),
            new CountryStatistics("Italy", 31954.1751781228, "Europe", Color.FromHex("cc3836")),
            new CountryStatistics("Japan", 33732.8682226596, "Asia", Color.FromHex("70c92f")),
            new CountryStatistics("Mexico", 14563.884253986, "America", Color.FromHex("9d419c")),
            new CountryStatistics("Russia", 19891.3528339013, "Europe", Color.FromHex("cc3836")),
            new CountryStatistics("Saudi Arabia", 22713.4852913284, "Asia", Color.FromHex("70c92f")),
            new CountryStatistics("South Africa", 10565.1840563081, "Africa", Color.FromHex("f8ca00")),
            new CountryStatistics("South Korea", 29101.0711400706, "Asia", Color.FromHex("70c92f")),
            new CountryStatistics("Turkey", 15686.860167575, "Africa", Color.FromHex("f8ca00")),
            new CountryStatistics("United Kingdom", 35686.1997705521, "Europe", Color.FromHex("cc3836")),
            new CountryStatistics("Spain", 32230.3585974199, "Europe", Color.FromHex("cc3836")),
            new CountryStatistics("USA", 47153.0094273427, "America", Color.FromHex("9d419c")),
        };
        public List<CountryStatistics> SeriesData => this.data;
    }

    public class CountryStatistics {
        public string Country { get; private set; }
        public double Gdp { get; private set; }
        public string Region { get; private set; }
        public Color Color { get; private set; }

        public CountryStatistics(string country, double gdp, string region, Color color) {
            Country = country;
            Gdp = gdp;
            Region = region;
            Color = color;
        }
    }
}

Set the BarSeries.PointColorizer property to a ColorDataAdapter object with the following properties specified:

DataSource – a data source of point colors and legend item strings.
In this example, the data source contains both data required to build series points (arguments and values) and data used to color points and generate legend items. However, you can store point colors and legend items in a separate data source. In this case, the colorizer applies colors to points in turn. If the number of colors is less than the number of data points, colors are reused.
ColorDataMember – a data source field that contains colors for series points.
LegendTextDataMember – a data source field that contains text strings for legend items. The legend displays all unique Color/LegendText value pairs.

XAML

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

                <!-- Retrieve series point colors and legend items from the data source. -->
                <dxc:BarSeries.PointColorizer>
                    <dxc:ColorDataAdapter DataSource="{Binding CountryStatisticsData}"
                                          ColorDataMember="Color"
                                          LegendTextDataMember="Region"/>
                </dxc:BarSeries.PointColorizer>
            </dxc:BarSeries>
        </dxc:ChartView.Series>

        <!-- Specify axis and legend settings here. -->
    </dxc:ChartView>
</ContentPage>