PieChart API
Demos
For examples and details on the usage of this React component, visit the component demo pages:
Import
import PieChart from '/packages/x-charts/src/PieChart';
// or
import { PieChart } from '/packages/x-charts/src';
Props
Indicate which axis to display the bottom of the charts. Can be a string (the id of the axis) or an object ChartsXAxisProps
.
Type:
{ axisId: string, classes?: object, disableLine?: bool, disableTicks?: bool, fill?: string, label?: string, labelFontSize?: number, position?: 'bottom' | 'top', slotProps?: object, slots?: object, stroke?: string, tickFontSize?: number, tickMaxStep?: number, tickMinStep?: number, tickNumber?: number, tickSize?: number } | string
Default:
xAxisIds[0] The id of the first provided axis
Indicate which axis to display the left of the charts. Can be a string (the id of the axis) or an object ChartsYAxisProps
.
Type:
{ axisId: string, classes?: object, disableLine?: bool, disableTicks?: bool, fill?: string, label?: string, labelFontSize?: number, position?: 'left' | 'right', slotProps?: object, slots?: object, stroke?: string, tickFontSize?: number, tickMaxStep?: number, tickMinStep?: number, tickNumber?: number, tickSize?: number } | string
Default:
yAxisIds[0] The id of the first provided axis
Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object ChartsYAxisProps
.
Type:
{ axisId: string, classes?: object, disableLine?: bool, disableTicks?: bool, fill?: string, label?: string, labelFontSize?: number, position?: 'left' | 'right', slotProps?: object, slots?: object, stroke?: string, tickFontSize?: number, tickMaxStep?: number, tickMinStep?: number, tickNumber?: number, tickSize?: number } | string
Default:
null
Indicate which axis to display the top of the charts. Can be a string (the id of the axis) or an object ChartsXAxisProps
.
Type:
{ axisId: string, classes?: object, disableLine?: bool, disableTicks?: bool, fill?: string, label?: string, labelFontSize?: number, position?: 'bottom' | 'top', slotProps?: object, slots?: object, stroke?: string, tickFontSize?: number, tickMaxStep?: number, tickMinStep?: number, tickNumber?: number, tickSize?: number } | string
Default:
null
The component cannot hold a ref.