echarts雷达图为0的值不显示在中心点
时间: 2023-09-27 22:06:23 浏览: 160
如果 echarts 雷达图中某个指标的值为0,但是该指标仍然在雷达图中心点显示,可以采用以下两种方法解决:
1. 设置 `radar.center` 属性,将雷达图的中心点坐标调整到数据不为0的指标上。
```javascript
option = {
radar: {
center: ['50%', '50%'], // 将雷达图的中心点坐标调整到中间
// ... 其他设置
},
// ... 其他设置
};
```
2. 在数据中将该指标的值设置为 null 或 undefined,从而使该指标不参与图表的渲染。可以在数据处理时将值为0的指标替换为 null 或 undefined。
```javascript
const data = [
{ name: '数据1', value: [10, 0, 20, 30, 40] },
{ name: '数据2', value: [0, 20, 30, 40, 50] },
{ name: '数据3', value: [10, 20, 0, 30, 40] },
{ name: '数据4', value: [10, 20, 30, 0, 40] },
{ name: '数据5', value: [10, 20, 30, 40, 0] },
];
// 将value中为0的值替换为null
const processedData = data.map(item => {
const value = item.value.map(val => {
return val === 0 ? null : val;
});
return { name: item.name, value };
});
option = {
radar: {
// ... 其他设置
},
series: [{
type: 'radar',
data: processedData,
// ... 其他设置
}],
// ... 其他设置
};
```
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.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)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)