你正在查看 v1.0.1 文档。切换到最新版请访问：/

基础饼图

功能说明（What）

基础饼图用于展示整体占比与结构构成，适合少量类别的比例分析。

应用场景（When）

• 预算/成本构成
• 类别占比对比

快速上手（How - Quick）

import { BasePie } from '@ymhc/harmonycharts';
import type { BasePieConfig } from '@ymhc/harmonycharts';

@Entry
struct Index {
  @Prop basePieConfig: BasePieConfig = {
    data: [
      { name: 'A', value: 40 },
      { name: 'B', value: 32 },
      { name: 'C', value: 28 }
    ],
    tooltip: { show: true, trigger: 'item', confine: true },
    legend: { show: true }
  };

  build() {
    Column() {
      BasePie({ config: this.basePieConfig, chartHeight: 220 })
    }
  }
}

运行结果

完整示例配置（整页可用）

const option: HarmonyChartsOption = {
  tooltip: { show: true, trigger: 'item', confine: true },
  legend: { show: true },
  series: [
    {
      type: 'pie',
      name: 'Pie',
      radius: '60%',
      center: ['50%', '50%'],
      label: { show: true, position: 'inside', fontSize: 11 },
      data: [
        { name: 'A', value: 40 },
        { name: 'B', value: 32 },
        { name: 'C', value: 28 }
      ]
    }
  ]
};

默认值（精确工程默认）

该页面默认值与 BasePie 一致，详见总览页「默认值（精确工程默认）」。

配置项说明（API）

参数	说明	类型	默认值
radius	半径	number | string | [number | string, number | string]	'60%'
center	圆心	[number | string, number | string]	['50%','50%']
label	标签	LabelOption	{ show: true, position: 'inside' }

事件与交互（Events）

chart.on('click', (params) => {
  // params.seriesType === 'pie'
});

高级用法（Advanced）

• labelLine + outside 标签

注意事项 / 设计说明（Notes）

• 类别过多时可考虑使用环形/玫瑰图。