Selection

• May 10, 2022
• 3 minutes to read

You can use the mouse or touch gestures on touchscreen devices to select series points.

Selection Mode

The ChartBase.SelectionMode property defines whether a user can select series points. Set this property to None to disable selection. The DevExpress.WinUI.Core.ElementSelectionMode enumeration lists all possible selection modes. To enable selection, set the SelectionMode property to one of the following values:

Selection Mode	Example	Description
Single		A user can select a single series point. Click or tap a series point to select it.
Multiple		A user can select multiple series points. Click or tap a series point to select it. To deselect it, click or tap the series point again.
Extended (default)		Extended mode combines Single and Multiple selection mode behaviors. Click a series point to select it. Hold down the Shift or Ctrl key and click series points to select them simultaneously. Hold down the Ctrl key and click series points to deselect them.

The following code sets the ChartBase.SelectionMode property to DevExpress.WinUI.Core.ElementSelectionMode.Single.

In markup:

XAML

<Charts:PieChart x:Name="chartOfCountriesArea" SelectionMode="Single" ...>
    <!--Other settings-->
</Charts:PieChart>    

In code:

C#

using DevExpress.WinUI.Core;
//...
//chartOfCountriesArea is the chart's x:Name property value.
chartOfCountriesArea.SelectionMode = ElementSelectionMode.Single;

VB.NET

Imports DevExpress.WinUI.Core
'...
' chartOfCountriesArea is the chart's x:Name property value.
chartOfCountriesArea.SelectionMode = ElementSelectionMode.Single

Selection API

The SelectedItem and SelectedItems Properties

Use the SeriesView.SelectedItem property to access the selected data point when the ChartBase.SelectionMode property is set to Single. When ChartBase.SelectionMode is Multiple or Extended, use the SeriesView.SelectedItems property to obtain selected items.

The following example uses the MVVM pattern to bind the SelectedItem property:

XAML

<Charts:PieChart x:Name="chartOfCountriesArea" SelectionMode="Single">
    <!--Other settings-->
    <Charts:Series x:Name="seriesAreaOfTop10">
        <Charts:Series.View>
            <Charts:PieSeriesView x:Name="outerDoughnutView" 
                                          SelectedItem="{x:Bind ViewModel.SelectedCountry, Mode=TwoWay}">
            </Charts:PieSeriesView>
        </Charts:Series.View>
    </Charts:Series>
</Charts:PieChart>

The SelectionChanged Event

The ChartBase.SelectionChanged event occurs when a user selects or deselects series points. Use the e.Selection property to obtain selected items. The following example calculates the total area of selected countries:

C#

private void chartOfCountriesArea_SelectionChanged(object sender, ChartElementSelectionChangedEventArgs e) {
    double totalArea = 0;
    foreach (CountryStatisticInfo point in e.Selection) {
        totalArea += point.AreaMSqrKilometers;
    }
    selectedItemsText.Text = String.Format("Total area of ​​selected countries: {0}", totalArea);
}

VB.NET

Private Sub chartOfCountriesArea_SelectionChanged(ByVal sender As Object, ByVal e As ChartElementSelectionChangedEventArgs)
    Dim totalArea As Double = 0
    For Each point As CountryStatisticInfo In e.Selection
        totalArea += point.AreaMSqrKilometers
    Next
    selectedItemsText.Text = String.Format("Total area of ​​selected countries: {0}", totalArea)
End Sub

Use the e.ChangedElement property to get the series point whose selection state is changed. The e.IsSelected property returns this selection state. The following code calls a custom UpdateStatistics method for the last selected series point:

C#

private void chartOfCountriesArea_SelectionChanged(object sender, ChartElementSelectionChangedEventArgs e) {
    selectedItemsText.Text = String.Format("Total area of ​​selected countries: {0}", totalArea);
    if (e.IsSelected) {
        UpdateStatistics((CountryStatisticInfo)e.ChangedElement);
    }
}

VB.NET

Private Sub chartOfCountriesArea_SelectionChanged(ByVal sender As Object, ByVal e As ChartElementSelectionChangedEventArgs)
    selectedItemsText.Text = String.Format("Total area of ​​selected countries: {0}", totalArea)
    If e.IsSelected Then
        UpdateStatistics(CType(e.ChangedElement, CountryStatisticInfo))
    End If
End Sub