Skip to content

PieSeriesType API

Demos

Import

import { PieSeriesType } from '@mui/x-charts'

Properties

data

Type:TData[]


type

Type:'pie'


arcLabelOptional

The label displayed into the arc.

Type:'formattedValue' | 'label' | 'value' | ((item: Omit<DefaultizedPieValueType, 'label'> & { label?: string }) => string)


arcLabelMinAngleOptional

The minimal angle required to display the arc label.

Type:number

Default:0


arcLabelRadiusOptional

The radius between circle center and the arc label.
Can be a number (in px) or a string with a percentage such as '50%'.
The '100%' is the maximal radius that fit into the drawing area.

Type:number | string

Default:(innerRadius - outerRadius) / 2


colorOptional

Type:string


cornerRadiusOptional

The radius applied to arc corners (similar to border radius).

Type:number

Default:0


cxOptional

The x coordinate of the pie center.
Can be a number (in px) or a string with a percentage such as '50%'.
The '100%' is the width the drawing area.

Type:number | string

Default:'50%'


cyOptional

The y coordinate of the pie center.
Can be a number (in px) or a string with a percentage such as '50%'.
The '100%' is the height the drawing area.

Type:number | string

Default:'50%'


endAngleOptional

The end angle (deg) of the last item.

Type:number

Default:360


fadedOptional

Override the arc attributes when it is faded.

Type:{
/**
* Value added to the default `outerRadius`.
* Can be negative. It is ignored if you provide a `faded.outerRadius` value.
*/
additionalRadius?: number
innerRadius?: number
outerRadius?: number
cornerRadius?: number
paddingAngle?: number
arcLabelRadius?: number
color?: string
}


highlightedOptional

Override the arc attributes when it is highlighted.

Type:{
/**
* Value added to the default `outerRadius`.
* Can be negative. It is ignored if you provide a `highlighted.outerRadius` value.
*/
additionalRadius?: number
innerRadius?: number
outerRadius?: number
cornerRadius?: number
paddingAngle?: number
arcLabelRadius?: number
color?: string
}


highlightScopeOptional

The scope to apply when the series is highlighted.

Type:Partial<HighlightScope>


idOptional

Type:SeriesId


innerRadiusOptional

The radius between circle center and the beginning of the arc.
Can be a number (in px) or a string with a percentage such as '50%'.
The '100%' is the maximal radius that fit into the drawing area.

Type:number | string

Default:0


outerRadiusOptional

The radius between circle center and the end of the arc.
Can be a number (in px) or a string with a percentage such as '50%'.
The '100%' is the maximal radius that fit into the drawing area.

Type:number | string

Default:'100%'


paddingAngleOptional

The padding angle (deg) between two arcs.

Type:number

Default:0


sortingValuesOptional

The sorting strategy used to order pie slices.
Can be 'none', 'asc', 'desc', or a sorting function.

Type:ChartsPieSorting

Default:'none'


startAngleOptional

The start angle (deg) of the first item.

Type:number

Default:0


valueFormatterOptional

Formatter used to render values in tooltip or other data display.

Type:SeriesValueFormatter<TValue>