echarts pie显示比例
时间: 2023-09-22 18:10:10 浏览: 95
要在 Echarts 中显示饼图的比例,可以通过设置 `series` 中的 `label` 属性来实现。具体步骤如下:
1. 在 Echarts 的配置项中,定义一个 `series` 数组,用于存放饼图的数据。
2. 在 `series` 数组中,定义一个对象,表示一个饼图系列。
3. 在该对象中,设置 `type` 为 `'pie'`,表示这是一个饼图系列。
4. 在该对象中,设置 `data` 属性为饼图的数据数组。该数组中的每个元素表示一个饼图的数据项。
5. 在该对象中,设置 `label` 属性为一个对象,用于配置标签的样式和显示内容。
6. 在 `label` 对象中,设置 `formatter` 属性为一个函数,用于自定义标签的显示内容。
以下是一个示例代码:
```javascript
option = {
series: [{
type: 'pie',
data: [
{value: 335, name: '直接访问'},
{value: 310, name: '邮件营销'},
{value: 234, name: '联盟广告'},
{value: 135, name: '视频广告'},
{value: 1548, name: '搜索引擎'}
],
label: {
formatter: function(params) {
return params.name + ' : ' + (params.value / 1548 * 100).toFixed(2) + '%';
}
}
}]
};
```
在上述示例中,通过 `label` 的 `formatter` 函数将每个饼图数据项的名称和对应的比例显示在饼图上。其中 `(params.value / 1548 * 100).toFixed(2)` 表示计算比例,并保留两位小数。
请根据自己的实际需求修改示例代码中的数据和格式。希望能对你有所帮助!
阅读全文