Example of Histogram in Angular Chart Component

This Angular Histogram Chart example visualizes final examination results. The number of students between each interval is shown in data labels.

Examination Result
Source: www.gov.uk
Description

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 into the services.

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