Skip to main content

Series Colorizer

  • 6 minutes to read

The Series Colorizer provides the capability to assign a color to automatically generated series using one of the predefined algorithms.

series-colorizer-sample

This guide consists of the following sections:

The Chart Control ships with Series Point Colorizers that apply colors to series points and markers based on a condition. Refer to the following topic for more information: Series Point Colorizers.

You can also paint line and area series by segments. See the following topic to learn more: Segment Colorizers.

To manually assign a color to a series, specify the series view’s Color property.

Series Colorizer Setting at Design-Time

To change the series colorizer at design-time, select the chart, expand the ChartControl.SeriesTemplate property in the Properties window, locate the SeriesTemplate.SeriesColorizer property, and select the colorizer from the drop-down list.

series-colorizer-design-time

You can configure the selected colorizer, for example, specify keys that the Key-Color Colorizer should use to assign colors to series. Refer to the Predefined Series Colorizers section to learn more about the predefined colorizer options.

Series Colorizer Setting at Runtime

The following code snippet demonstrates how to assign the series colorizer at runtime:

chartControl.SeriesTemplate.SeriesDataMember = "Region";
chartControl.SeriesTemplate.ArgumentDataMember = "Year";
chartControl.SeriesTemplate.ValueDataMembers.AddRange("Value");
chartControl.SeriesTemplate.SeriesColorizer = new SeriesKeyColorColorizer() {
    // Colorizer customization is here.
};

The code above uses the following classes and properties:

Symbol Description
SeriesTemplate.SeriesColorizer Gets or sets the Series Colorizer that automatically paints series.
SeriesColorizerBase The base class for all colorizers.

Refer to the Predefined Series Colorizers section to learn more about the predefined colorizers and their options.

Predefined Series Colorizers

The chart control has the following predefined colorizers:

  • SeriesKeyColorColorizer

    This colorizer uses the series data member values as color keys to assign colors to series. It is useful then the chart can display multiple series and each series should have a fixed color.

    key-color-series-colorizer

    The following code demonstrates how to configure the colorizer:

    SeriesKeyColorColorizer colorizer = new SeriesKeyColorColorizer() {
        // The colorizer uses the specified palette's colors.
        PaletteName = "Office2013",
        // The custom key provider that the colorizer uses 
        // to convert the series data member's value to another object.
        KeyProvider = new CustomKeyProvider()
    };
    // Keys that colorizer assigns to its palette's colors to create key-color pairs.
    // The first key forms a pair with the first color, the second key with the second color, etc.
    colorizer.Keys.AddRange(new object[]{"One", "Two", "Three"});
    chartControl.SeriesTemplate.SeriesColorizer = colorizer;
    

    Note

    When the colorizer starts painting series and its Keys collection is empty, the colorizer fills this collection using the unique series data member values.

    The code above uses the following properties:

    Property Description
    SeriesKeyColorColorizer.PaletteName Gets or sets the name of the palette whose colors the colorizer assigns to series.
    SeriesKeyColorColorizer.Keys Returns the collection of keys that the colorizer uses to assign colors to series.
    SeriesKeyColorColorizer.KeyProvider Gets or sets the object that converts series data member values into series color keys.
  • SeriesDataSourceColorizer

    This colorizer uses objects from a data source to paint series. These objects can be an integer representing an ARGB color, a string that is the color name or a Color object.

    series-colorizer--data-source

    The code below shows how to customize the colorizer.

    class Department {
        public String Name { get; set; }
        public Color Marker { get; set; }
    }
    // ...
    chartControl.SeriesTemplate.SeriesColorizer = new SeriesDataSourceColorizer() {
        // The data source storing objects that contain a series's color.
        DataSource = new List<Department> {
            new Department { Name = "DevAV North", Marker = Color.FromArgb(0xE1, 0x83, 0x35)},
            new Department { Name = "DevAV Europe", Marker = Color.FromArgb(0x1E, 0x91, 0xD6)},
            new Department { Name = "DevAV Australia", Marker = Color.FromArgb(0x8F, 0xC9, 0x3A)},
        };
        // The name of the data member storing objects that should be equal to a series data member's values from the main data source.
        SeriesKeyMember = "Name",
        // The name of the data member that contains colors.
        SeriesColorMember = "Marker"
    };
    

    Important

    The main data source mentioned in the code snippet is the series template’s data source.

    The code snippet uses the following properties:

    Property Description
    SeriesDataSourceColorizer.DataSource Gets or sets the data source whose data items the colorizer uses to paint series.
    SeriesDataSourceColorizer.SeriesKeyMember Gets or sets the name of data member whose values represent colors in which the colorizer paints series.
    SeriesDataSourceColorizer.SeriesColorMember Gets or sets the name of a data member whose values are used as series identifiers.

Custom Series Colorizers Implementation

The following code demonstrates how to implement a custom colorizer that should paint series using non-predefined algorithm.:

class CustomSeriesColorizer : SeriesColorizerBase {
    List<object> metColors = new List<object>();

    public override Color GetSeriesColor(object seriesKey, Palette palette) {
        int keyIndex;
        if (metColors.Contains(seriesKey)) {
            keyIndex = metColors.IndexOf(seriesKey);
        } else {
            keyIndex = metColors.Count;
            metColors.Add(seriesKey);
        }
        return palette[keyIndex % palette.Count].Color;
    }

    protected override ChartElement CreateObjectForClone() {
        return new CustomSeriesColorizer();
    }
}

Each series colorizes should inherit the abstract SeriesColorizerBase class that declares the SeriesColorizerBase.GetSeriesColor method that returns a color that corresponds to the specified series key (the series data member value).