echarts中不同颜色图形分别设置不同颜色的分割线

实现效果如图:

线对应黄色,柱对应蓝色

准备工作:

首先我们要知道,一个坐标轴对应的分割线只有一条,设置颜色时肯定也只能设置单一的一种,那么想要实现这个需求,就是要在原有的基础以上多创建一个坐标轴,这个案例时y轴分割线,所以,需要写的y轴个数应该是2才可以实现。通过查阅文档我们可以知道,yAxis也是可以写成数组形式的,数组中可以包含若干个对象,那么每个对象就对应着一个坐标轴,分别设置每个坐标轴的分割线颜色作为备选项

使用方式:

在文档中series有一个yAxisIndex属性,它可以通过索引值指定y轴数组中对应的轴线并进行使用,当然是在yAxis是数组的前提下才可以使用(存在多个坐标轴),在为了设置分割线的情况下同样也要给坐标轴’value‘类型的type,其他涉及到y轴的样式也是可以一并进行设置

实现:

①准备:样式根据需求设置

准备两个y轴

②设置:属性值为1,则代表这个线的值会渲染到第二个y轴上,第二个y轴的样式也会投射到这个线的上面

使用方式

你可能感兴趣的:(echarts中不同颜色图形分别设置不同颜色的分割线)