echartsx 轴有很多项目,目标值只有一个 350 ,怎么配置 350
时间: 2023-07-16 21:17:37 浏览: 49
如果您是使用 echarts 5 版本及以上,可以在 xAxis 配置项中设置 axisLabel.formatter 或者 axisPointer.label.formatter 选项,如下所示:
```javascript
option = {
// ...
xAxis: {
type: 'category',
data: ['项目1', '项目2', '项目3', '项目4', '项目5'],
axisLabel: {
formatter: function (value, index) {
if (value === '项目3') {
return '{value|' + value + '}\n{target|350}';
} else {
return value;
}
},
rich: {
value: {
color: '#333',
fontSize: 14,
fontWeight: 'bold'
},
target: {
color: '#ff0000',
fontSize: 18,
fontWeight: 'bold'
}
}
}
},
// ...
};
```
上述代码中,我们使用了 rich 配置项来设置目标值的样式,通过设置 formatter 函数来判断当前的值是否是目标值,如果是,则返回一个包含目标值和项目名称的字符串,使用 rich 配置项来设置目标值的样式。
如果您是使用 echarts 4 版本及以下,可以在 xAxis.axisLabel.formatter 或者 tooltip.formatter 中设置类似的内容,具体方式类似。
相关推荐
![js](https://img-home.csdnimg.cn/images/20210720083646.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)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)