echarts怎么设置markline上的splitarea

Posted 2023-03-28

参考技术A ECharts开源来自百度商业前端数据可视化团队，基于html5 Canvas，是一个纯javascript图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验，赋予了用户对数据进行挖掘.

echarts中markLine的隐藏

做echarts图表时有时需要用到markLine,但是数据是由接口传递来的，需要根据接口是否有这个来参数来确定是否需要渲染markLine。

如果是在同一个表上渲染不同的数据，而且上一个接口有markLine需要用到的参数别的接口没有markLine需要用到的参数，那么上一次渲染出来的markLine就要进行隐藏。

看官网api的时候，尝试过设施label:false,但是并不管用(也许是我姿势不对？？)，在网上搜索，也只有添加markLine的方法，并没有隐藏或者删除markLine的方法。

最后，还是被我研究出一种方法，直接上代码:

添加markLine:

markLine:
　　data:[
　　　　yAxis: ‘30‘,　　//数值
　　　　lineStyle:
　　　　　　normal:
　　　　　　　　color: ‘red‘,　　//颜色

　　　　　　　　type: ‘solid‘　　//线条样式

　　　　　　
　　　　
　　]

最终效果:

 

隐藏markLine:

markLine:
　　data:[

　　　　yAxis: ‘‘, //清空数值，清空后默认为0，不知道是不是echarts的设置
　　　　lineStyle:
　　　　　　normal:
　　　　　　　　color:‘white‘,　　设置背景色为白色，因为我背景色就是白色
　　　　　　　　opacity:0,　　//线条透明度设置为0
　　　　　　
　　　　
　　]

最终效果: