Filtering Data

• Jun 18, 2019
• 3 minutes to read

This document describes how to filter chart data at the chart control level (as opposed to the filtering at the data source level).

Note

When dealing with large data sources, filtering data at the chart control level may not be as efficient as filtering at the data source level. We recommend filtering and sorting your data source at the data level before it is visualized if End-Users should not change filtering and sorting parameters.

You can use the FilterControl or Filtering UI Context filter criteria builders to filter chart data or a chart’s series data. Refer to the Criteria Language Syntax guide to learn more about filter criteria.

In this guide, the Filtering UI Context is used to demonstrate how to filter chart’s data.

The topic contains the following sections:

• Design-Time Filtering Context Initialization
• Run-Time Filtering Context Initialization

Design-Time Filtering UI Context Initialization

As an example, the form contains a Chart Control, Accordion Control and Filtering UI Context. To filter a template-generated series, click the FilteringUIContext’s smart tag and set its Client property to the Chart Control.

Important

An individual series’ data source cannot be specified as the Context’s Client at design time.

Then, you should initialize filters. Call the FilteringUIContext.RetrieveFields() method in the Form.Load event handler.

C#

private void Form1_Load(object sender, EventArgs e) {
    filteringUIContext.RetrieveFields();
}

VB.NET

Private Sub Form1_Load(sender As Object, e As EventArgs)
    filteringUIContext.RetrieveFields()
End Sub

Now, the Chart Control uses the Filtering UI to manage its series’ SeriesBase.FilterCriteria.

The next step is filtering UI customization. Refer to the Filtering Attributes guide for more information.

Run-Time Filtering UI Context Initialization

The Filtering UI requires runtime initialization if it should filter an individual series. The following code demonstrates Chart filtering using a custom filter model. Note that in this case, you should use the FilteringUIContext.SetFilterCriteriaBinding method instead of the Client property to bind the Context to the SeriesBase.FilterCriteria property.

Note

A complete sample project is available at https://github.com/DevExpress-Examples/how-to-filter-a-chart-using-the-filtering-ui-context-t566197

Form1.cs

Series ProductSeries { get { return chartControl.Series["Products"]; } }
List<Product> Products { get; set; }
FilterViewModel FilterViewModel { get; set; }

private void Form1_Load(object sender, EventArgs e) {
    ProductSeries.DataSource = Products;
    ProductSeries.ArgumentDataMember = "ProductName";
    ProductSeries.ValueDataMembers.AddRange("OnOrderIncome");

    filteringUIContext.ParentViewModel = FilterViewModel;
    filteringUIContext.ModelType = typeof(Product);
    filteringUIContext.SetFilterCriteriaBinding(ProductSeries, s => s.FilterCriteria);
    filteringUIContext.RetrieveFields();
}

Form1.vb

Private ReadOnly Property ProductSeries() As Series
    Get
        Return chartControl.Series("Products")
    End Get
End Property
Private Property Products() As List(Of Product)
Private Property FilterViewModel() As FilterViewModel

Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    ProductSeries.DataSource = Products
    ProductSeries.ArgumentDataMember = "ProductName"
    ProductSeries.ValueDataMembers.AddRange("OnOrderIncome")

    filteringUIContext.ParentViewModel = FilterViewModel
    filteringUIContext.ModelType = GetType(Product)
    filteringUIContext.SetFilterCriteriaBinding(ProductSeries, Function(s) s.FilterCriteria)
    filteringUIContext.RetrieveFields()
End Sub