The PieChart
component displays part-to-whole relationships using circular slices. Each slice represents a category, and its angle is proportional to the numeric value it contributes to the total.
This chart is well-suited for visualizing distribution, market share, or proportions across categories.
marks: Array<object>
(required)Defines the segments (slices) of the pie chart.
Each mark must include:
category: string
A label for the slice. It identifies the category the value belongs to.
value: number
The numeric value used to determine the slice’s angle. All values are summed and each slice’s angle is proportional to its fraction of the total.
Inherits additional properties from ChartMarkProps
for styling:
foregroundStyle
– set color per categoryannotation
– attach labels or iconsopacity
, cornerRadius
, zIndex
, etc.PieChart
is suitable for: