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

Example of Histogram in ASP.NET Core Chart Control

This sample visualizes the student's results of the final examination with histogram series in chart. Number of students between each interval is shown by using the data label.


In this example, you can see how to render and configure the histogram type charts. Histogram type charts can provide a visual display of large amounts of data that are difficult to understand in a tabular or spreadsheet form. You can use the border and fill properties to customize the vertical rect. The dataLabel property is used to represent individual data and its value.

Tooltip is enabled in this example. To see the tooltip in action, hover the mouse over a point or tap a point in touch enabled devices.

Injecting Module

Chart component features are segregated into individual feature-wise modules. To use histogram series, you should inject the HistogramSeries module using the Chart.Inject(HistogramSeries) method.

More information on the histogram series can be found in this documentation section.