This nested donut chart example demonstrates how to visualize the population of Qatar by nationality using multiple pie series. The outer ring represents individual countries, while the inner ring shows regional distribution with consistent color grouping.
In this example, multiple pie series are used to display hierarchical data in concentric rings. This approach makes it easy to compare nationality-level population distribution alongside broader regional groupings within Qatar.
The radius and{' '}
innerRadius properties control the size and thickness of each ring, enabling the nested donut appearance. The{' '}
pointColorMapping property ensures that countries and their corresponding regions share the same color for visual consistency.
The Tooltip feature is enabled to provide additional information. Hover over a segment (or tap on touch devices) to view the nationality and its population share percentage.
Injecting Module
The Charts component's features are segregated into individual feature modules. To use pie series, we need to inject the PieSeries module into services.
For more details about rendering multiple pie series, refer the documentation section.