How to: Create Custom Legend Radio Buttons to Control Visibility of a Chart Series

  • 3 minutes to read

This example demonstrates how to show a series (Point, Line or Area), depending on the selection state of a custom radio button in the chart legend.

To accomplish this task, do the following:

Use the ChartControl.CustomDrawSeries (WebChartControl.CustomDrawSeries) event handler to create a custom appearance for radio buttons based on the color of a selected series.

To provide the capability for custom radio buttons to show (or hide) the series, use the LegendItemCheckedEventArgs.CheckedElement and SeriesBase.CheckedInLegend properties in the ChartControl.LegendItemChecked (WebChartControl.LegendItemChecked) event.

View Example

using System;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Windows.Forms;
using DevExpress.XtraCharts;

namespace CustomCheckboxesInLegendViewAndBehavior {
    public partial class mainForm : Form {
        const int LegendRadioSide = 17;
        const int LegendRadioInnerPointBoundsSide = 8;
        const float LegendRadioWidth = 1.5f;
        bool initializationFlag = false;

        public mainForm() {
            InitializeComponent();
            chartControl.BeginInit();
            {
                chartControl.LegendItemChecked += OnLegendItemChecked;
                chartControl.CustomDrawSeries += OnCustomDrawSeries;
                chartControl.Legend.UseCheckBoxes = true;
                chartControl.Series["Point"].CheckedInLegend = false;
                chartControl.Series["Line"].CheckedInLegend = true;
                chartControl.Series["Area"].CheckedInLegend = false;
            }
            chartControl.EndInit();
            initializationFlag = false;
        }

        void OnLegendItemChecked(object sender, LegendItemCheckedEventArgs e) {
            if (initializationFlag == true)
                return;
            initializationFlag = true;
            {
                Series checkedSeries = e.CheckedElement as Series;
                if (checkedSeries == null)
                    throw new Exception("Expected series only");
                foreach (Series series in chartControl.Series)
                    series.CheckedInLegend = false;
                checkedSeries.CheckedInLegend = true;
                chartControl.Titles[0].Text = checkedSeries.Name;
            }
            initializationFlag = false;
        }

        void OnCustomDrawSeries(object sender, CustomDrawSeriesEventArgs e) {
            Bitmap bitmap = new Bitmap(LegendRadioSide, LegendRadioSide);
            using (Graphics graphics = Graphics.FromImage(bitmap)) {
                graphics.SmoothingMode = SmoothingMode.HighQuality;
                Color seriesColor = GetSeriesColor(e.Series, chartControl);
                using (Pen radioPen = new Pen(seriesColor, LegendRadioWidth)) {
                    int radioRadius = LegendRadioSide - 3;
                    Rectangle radioRectangle = new Rectangle(1, 1, radioRadius, radioRadius);
                    graphics.DrawEllipse(radioPen, radioRectangle);
                }
                if (e.Series.CheckedInLegend) {
                    using (Brush brush = new SolidBrush(seriesColor)) {
                        int coord = (LegendRadioSide - LegendRadioInnerPointBoundsSide) / 2;
                        Rectangle filledEllipseBounds = new Rectangle(coord, coord,
                              LegendRadioInnerPointBoundsSide, LegendRadioInnerPointBoundsSide);
                        graphics.FillEllipse(brush, filledEllipseBounds);
                    }
                }
            }
            e.DisposeLegendMarkerImage = true;
            e.LegendMarkerImage = bitmap;
        }

        Color GetSeriesColor(Series series, ChartControl chartControl) {
            int seriesIndex = chartControl.Series.IndexOf(series);
            string paletteName = chartControl.PaletteName;
            Palette currentPalette = chartControl.PaletteRepository[paletteName];
            PaletteEntry paletteEntryAccordingToSeries = currentPalette[seriesIndex];
            Color result = paletteEntryAccordingToSeries.Color;
            return result;
        }
    }
}