Yamada UIにスターをあげる

スター
Yamada UIYamada UIv1.6.3

PieChart

PieChartは、複数のデータを比較するためのパイチャートを描画するコンポーネントです。

ソース@yamada-ui/charts

Props

PieChartProps

data

必須

説明

Chart data.

タイプ

CellProps[]

cellProps

説明

Props for the cell.

タイプ

Partial<CellProps>

chartProps

説明

Props passed down to recharts PieChart component.

タイプ

PieChartProps

colorScheme

説明

The visual color appearance of the component.

タイプ

"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"

containerProps

説明

Props passed down to recharts ResponsiveContainer component.

タイプ

ResponsiveContainerProps

endAngle

説明

Controls angle at which chart ends.

タイプ

number

デフォルト

-270

fillOpacity

説明

Controls fill opacity of all pies.

タイプ

number | [number, number]

デフォルト

1

innerRadius

説明

Controls innerRadius of the chart segments. If it is a number, it is the width of the radius. For example, 60 means the radius is 60px and the diameter is 120px.

タイプ

string | number

デフォルト

'0%'

isPercent

説明

Determines whether labels should be displayed as percentages.

タイプ

boolean

デフォルト

false

labelFormatter

説明

A function to format labels.

タイプ

(value: number) => string

labelOffset

説明

Distance between chart and label.

タイプ

number

legendProps

説明

Props passed down to recharts 'Legend' component.

タイプ

LegendProps

outerRadius

説明

Controls thickness of the chart segments. If it is a number, it is calculated as px. If it is a number, it is the width of the radius. For example, 60 means the radius is 60px and the diameter is 120px.

タイプ

string | number

デフォルト

'80%'

paddingAngle

説明

Controls padding between segments.

タイプ

number

デフォルト

0

pieProps

説明

Props for the pie.

タイプ

Partial<PieProps>

size

説明

The size of the PieChart.

タイプ

"sm" | "md" | "lg"

デフォルト

"md"

startAngle

説明

Controls angle at which chart starts.

タイプ

number

デフォルト

90

strokeWidth

説明

Stroke width for the chart pies.

タイプ

number

デフォルト

1

tooltipAnimationDuration

説明

Specifies the duration of animation, the unit of this option is ms.

タイプ

number

デフォルト

0

tooltipDataSource

説明

Determines which data is displayed in the tooltip.

タイプ

TooltipDataSourceType

デフォルト

'all'

tooltipProps

説明

Props passed down to recharts 'Tooltip' component.

タイプ

TooltipProps

unit

説明

Unit displayed next to each value in tooltip.

タイプ

string

valueFormatter

説明

A function to format values on inside the tooltip.

タイプ

(value: any) => string

variant

説明

The variant of the PieChart.

タイプ

string

withLabelLines

説明

Determines whether segments labels should have lines that connect the segment with the label.

タイプ

boolean

デフォルト

false

withLabels

説明

Determines whether each segment should have associated label.

タイプ

boolean

デフォルト

false

withLegend

説明

If true, legend is visible.

タイプ

boolean

デフォルト

false

withTooltip

説明

If true, tooltip is visible.

タイプ

boolean

デフォルト

true

CellProps

name

必須

タイプ

string

value

必須

タイプ

number

dimCell

タイプ

Partial<CellProps>

GitHubでこのページを編集する

BarChartDonutChart