Appearance
你正在查看 v1.0.1 文档。切换到最新版请访问:/
饼图快速开始
ts
import { BasePie } from '@ymhc/harmonycharts'; // 引入饼图组件
import type { BasePieConfig } from '@ymhc/harmonycharts'; // 引入配置类型
@Entry // 入口页面
struct Index { // 页面结构体
@Prop basePieConfig: BasePieConfig = { // 组件配置(可响应)
seriesName: 'Category Split', // 系列名称
data: [ // 数据
{ name: 'Tech', value: 42, color: '#5B8FF9' },
{ name: 'Retail', value: 28, color: '#5AD8A6' },
{ name: 'Service', value: 18, color: '#F6BD16' },
{ name: 'Other', value: 12, color: '#E8684A' }
],
radius: '60%', // 半径
center: ['50%', '50%'], // 中心点
tooltip: { show: true, trigger: 'item', confine: true }, // 点触发提示
legend: { show: true } // 图例开关
}; // 配置结束
build() { // 页面构建
Column() { // 纵向布局
BasePie({ config: this.basePieConfig, chartHeight: 220 }) // 渲染饼图
} // 布局结束
} // 构建结束
}