Example of Donut in React 3D Circular Chart Component


This sample visualizes the top-selling electric cars in China using a 3D donut chart. Data points are enhanced with tooltip.

More Details...


In this example, you can see how to render and configure a 3D donut chart. The donut chart is a circular graphic, which is ideal for displaying categories as a proportion or a percentage of the whole. To create a donut in the pie series, use the innerRadius property. You can rotate and tilt the donut chart using a mouse or touch-enabled devices.

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

Injecting Module

3D circular chart component features are segregated into individual feature-wise modules. To use datalabel, you need to inject the CircularChartDataLabel3D module into services.