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

Example of Selection in ASP.NET Core Chart Control

This sample demonstrates the selection behavior and its mode along with the highlight and highlight patterns in the chart.

DEMO
SOURCE
Enable Multi-selection:
Selection Mode:
Selection Patterns:
Enable Highlight:
Highlight Color:
Highlight Patterns:

In this sample, any point or series can be selected in the chart by clicking on or touching the point. You can also change the selection mode by changing the Selection Mode option in the properties panel. You can enable multiple selections with the Enable Multi Selection option. You can also select a point while loading a chart using the SelectedDataIndexes option. While hovering the point, the point is highlighted using the Enable Highlight option, as well as you can set different highlight patterns and colors using the Highlight Patterns and Highlight Color option.

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.


More information about selection can be found in this documentation section.