• Bootstrap v5
  • Bootstrap v5 Dark
  • Tailwind CSS
  • Tailwind CSS Dark
  • Material
  • Bootstrap v4
  • Fabric
  • Fabric Dark
  • High Contrast
Theme Selection
Mode Selection
*Translated by Google Translator.
Essential Studio
All Controls

Example of Selection in ASP.NET Core Chart Control

This sample illustrates the selection feature in chart. To select a specific point, click the point. The selection mode can be changed by changing Selection Mode in panel. Multiple Selection also can be enabled by Enable Multiple Selection.

Selection Mode:
Enable Multi-selection:
Selection Patterns:
Enable Highlight:
Highlight Patterns:

This sample demonstrates the selection behavior in a chart. Any point or a series can be selected in a chart by clicking or touching the point. We can also select the point while loading chart through selectedDataIndexes properties. Click to select a point or series, click and drag to enable rectangular selection. Rectangular selection will return the collection point that are selected under the region.

Tap to select a point or series, double tap and drag to enable rectangular selection in touch enabled devices.

Chart supports five mode of selection which can be set using the SelectionMode property.

  • Series - Select the series in chart.
  • Point - Select a point in the series .
  • Cluster - Select a group of points in the chart.
  • DragXY - Rectangular selection with respect to both axis.
  • DragX - Rectangular selection with respect to horizontal axis.
  • DragY - Rectangular selection with respect to vertical axis.

Injecting Module

Chart component features are segregated into individual feature-wise modules. To use selection feature, we need to inject Selection module into services.