echarts 饼图 不足100% 去除自动补全
时间: 2023-07-08 07:20:48 浏览: 66
如果你不想让 ECharts 在饼图总和不足100%时自动补全,可以使用 `avoidLabelOverlap` 属性来控制标签是否重叠。将 `avoidLabelOverlap` 设置为 `false`,则可以避免自动补全的问题。
以下是一个示例代码:
```javascript
option = {
series: [
{
type: 'pie',
radius: '55%',
avoidLabelOverlap: false, // 避免标签重叠
data: [
{value: 10, name: 'A'},
{value: 20, name: 'B'},
{value: 30, name: 'C'},
{value: 40, name: 'D'}
]
}
]
};
```
在上面的示例中,如果不设置 `avoidLabelOverlap` 属性,那么当饼图总和不足100%时,ECharts 会自动调整标签位置,可能会导致标签重叠。如果设置为 `false`,则可以避免这个问题。
相关问题
echarts 饼图和不足100% 会自动补全 如何去掉移动补全
要去掉饼图的自动补全功能,可以在 ECharts 的饼图配置项中设置 label.normal.showIncomplete 为 false 即可。例如,下面的代码可以实现不显示不足100%的饼图数据的自动补全效果:
```javascript
option = {
series: [{
type: 'pie',
data: [
{value: 30, name: 'A'},
{value: 50, name: 'B'},
{value: 20, name: 'C'}
],
label: {
normal: {
show: true,
// 设置为 false 不显示不足100%的数据补全
showIncomplete: false
}
}
}]
};
```
这样设置后,饼图上不会显示不足100%的数据补全了。
echarts 饼图总和不足100% 解决会自动补全的问题
如果你的饼图总和不足100%,可以在 ECharts 中使用 `roseType` 属性来解决这个问题。当 `roseType` 设置为 `'area'` 时,ECharts 会自动将饼图总和补充为100%。
以下是一个示例代码:
```javascript
option = {
series: [
{
type: 'pie',
radius: '55%',
roseType: 'area', // 设置为 'area' 即可自动补全
data: [
{value: 10, name: 'A'},
{value: 20, name: 'B'},
{value: 30, name: 'C'},
{value: 40, name: 'D'}
]
}
]
};
```
在上面的示例中,如果不设置 `roseType` 属性,那么饼图的总和只有 10 + 20 + 30 + 40 = 100,如果设置为 `'area'`,则会自动将饼图总和补充为100%。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)