export type PieSlice = { /** 表示名。凡例・表示切替の内部キーは index 付きで一意化する */ label: string; /** 0 以下はスライスとして描画しない */ value: number; /** 未指定時は theme.palette.chart の系列色を使う */ color?: string; }; export type PieChartVariant = "pie" | "donut"; /** スライス外側ラベルの内容。none は非表示 */ export type PieSliceLabel = "none" | "value" | "percent" | "both"; /** スライス外側ラベルの見た目。未指定項目は theme.palette.chart.pie.label */ export type PieSliceLabelStyle = { fontSize?: number; color?: string; }; export type PieChartProps = { data: PieSlice[]; /** pie: 円 / donut: 穴あき。デフォルト pie */ variant?: PieChartVariant; /** * theme.palette.chart.colorSchemes のキー。 * 未指定時は palette.chart.series(デフォルト)を使う。 */ colorScheme?: string; /** * 数値の表示。tooltip のほか、外側ラベル・内側ラベル・donut 中央合計にも使う。 * 未指定時は toLocaleString() */ valueFormatter?: (value: number) => string; /** * スライス外側のラベル。 * - none: 出さない(デフォルト) * - value: 絶対値 * - percent: 構成比 * - both: 絶対値と構成比 */ sliceLabel?: PieSliceLabel; /** * スライス外側ラベルのフォントサイズ・色。 * 未指定項目は theme.palette.chart.pie.label を使う。 */ sliceLabelStyle?: PieSliceLabelStyle; /** * スライス内側のラベル。 * - none: 出さない(デフォルト) * - value: 絶対値 * - percent: 構成比 * - both: 絶対値と構成比 */ innerLabel?: PieSliceLabel; /** * スライス内側ラベルのフォントサイズ・色。 * 色を省略したときはスライス色とのコントラストで白または theme 色を選ぶ。 */ innerLabelStyle?: PieSliceLabelStyle; /** スライスが 2 個以上のとき凡例を表示。デフォルト true */ showLegend?: boolean; /** * donut の中央に表示中スライスの合計を出す。 * pie では無視。デフォルト true */ showCenterTotal?: boolean; /** * donut 中央の合計のフォントサイズ・色。 * fontSize は数値に適用(「合計」はそれに合わせて小さめ)。 * 未指定時のサイズは穴の大きさから自動、色は theme.palette.chart.pie.centerTotal。 */ centerTotalStyle?: PieSliceLabelStyle; /** 凡例クリックでスライスの表示/非表示を切り替え。デフォルト true */ interactiveLegend?: boolean; /** true の間、チャートの代わりにローディング表示 */ loading?: boolean; /** 描画可能なデータがないときのメッセージ。未指定時は「データがありません」 */ emptyMessage?: string; "aria-label": string; height?: number; className?: string; };