Example of Pyramid in Angular Chart Component

This Angular Pyramid Chart visualizes food comparison data by using pyramid series.

Food Comparison Chart
Description

In this example, you can see how to render and configure a pyramid chart. This chart is shaped like a triangle, with lines dividing it into sections of varying widths. Depending on the Y coordinate, the width indicates a level of hierarchy among other categories. The DataLabel represents individual data and its value.

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

Injecting Module

Chart component features are segregated into individual feature-wise modules. To use Pyramid feature, we need to inject PyramidSeriesService into the @NgModule.providers section.

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