PieGraph
基础饼图组件。
使用场景
- 饼图广泛得应用在各个领域，用于表示不同分类的占比情况，通过弧度大小来对比各种分类，可以很好地帮助用户快速了解数据的占比分配。
API
Attributes
饼图组件属性。
| 参数 | 说明 | 类型 | 必传 | 可选值 | 默认值 |
|---|---|---|---|---|---|
| data | 图表数据。数据类型为数组（RatioDataType） | array | 是 | - | - |
| RatioOption | 饼图配置,传入数据类型为 RatioOption | RatioOption | 否 | - | - |
| labelPosition | 文字标签展示的位置。默认为 outside，展示在饼图扇区外侧。 | string | 否 | inside/outside/center/none/hidden/outside | 版本 |
| sortType | 数据排序方式。默认不进行排序，数据以顺时针开始展示。 | string | 否 | desc/asc/none | none |
| showLegend | 是否显示图例，默认为 true | boolean | 否 | true/false | true |
| tooltipFormatter | 提示框浮层内容格式器 | function / null | 否 | - | null |
RatioDataType
RatioDataType 包含以下参数。
| 参数 | 说明 | 类型 | 必传 | 可选值 | 默认值 | 版本 |
|---|---|---|---|---|---|---|
| value | 饼图每个数据项的数值 | number | 是 | - | - | 版本 |
| name | 饼图每个数据项的名称 | string | 是 | - | - | 版本 |
RatioOption
饼图数据项的配置参数。
| 参数 | 说明 | 类型 | 必传 | 默认值 | 可选值 |
|---|---|---|---|---|---|
| type | 图表类型 | string | 是 | rose | pie/rose/ring |
| name | 系列名称，用于 tooltip 的显示，legend 的图例筛选，在 setOption 更新数据和配置项时用于指定对应的系列 | string | 否 | - | - |
| minShowLabelAngle | 小于这个角度（0 ~ 360）的扇区，不显示标签 | number | 否 | - | 0 |
| roseType | 是否展示成南丁格尔图，通过半径区分数据大小，圆心角展现数据的百分比 | boolean | 否 | true/false | false |
| top | 组件离容器上侧的距离 | string/number | 否 | 0 | - |
| right | 组件离容器右侧的距离 | string/number | 否 | 0 | - |
| bottom | 组件离容器下侧的距离 | string/number | 否 | 0 | - |
| left | 组件离容器左侧的距离 | string/number | 否 | 0 | - |
| label | 饼图图形上的文本标签，可用于说明图形的一些数据信息，比如值，名称等，详细参考label | object | 否 | - | - |
| labelLine | 标签的视觉引导线配置，详细参考labelLine | object | 否 | - | - |
| labelLayout | 标签的统一布局配置，详细参考labelLayout | object | 否 | - | - |
| emphasis | 高亮状态的扇区和标签样式，详细参考emphasis | object | 否 | - | - |
| itemStyle | 占比图区块的样式，详细参考itemStyle | object | 否 | - | - |
| radius | 占比图的内外半径，数组第一项是内半径，第二项是外半径，可以设置为数字或者百分比。 | number[]/ string[] | 否 | [0, '75%'] | - |
| blur | 淡出状态的扇区和标签样式。开启 emphasis.focus 后有效，详细参考blur | object | 否 | - | - |
| select | 选中状态的扇区和标签样式。开启 selectedMode 后有效，详细参考select | object | 否 | - | - |
| selectedMode | 选中模式的配置，表示是否支持多个选中，默认关闭，支持布尔值和字符串，字符串取值可选'single'，'multiple'，分别表示单选还是多选 | string/boolean | 否 | false | single/multiple/true/false |
| selectedOffset | 选中扇区的偏移距离 | number | 否 | 10 | - |
| silent | 图形是否不响应和触发鼠标事件，默认为 false，即响应和触发鼠标事件说明 | boolean | 否 | false | true/false |
| animation | 是否开启动画,默认开启 | boolean | 否 | true | true/false |
| markPoint | 图表标注，详细参考markPoint | object | 否 | - | - |
| markLine | 图表标线，详细参考markLine | object | 否 | - | - |
| markArea | 图表标域，常用于标记图表中某个范围的数据，例如标出某段时间投放了广告，详细参考markArea | object | 否 | - | - |
| animationType | 初始化动画类型，expansion 为沿圆弧展开的效果，scale 为缩放效果 | string | 否 | expansion | expansion/scale |