echarts折线图,两条线数据一样时怎么区分开

Question

如图,两条线数据一样时完全重叠了,怎么能做出些区分,让用户能清楚的知道是数据一样,而不是缺少了一条线呢

Answer 1

就是改变视觉效果，可以在两条线重合时，改变两条线的颜色，就是融合后的颜色，这个实现起来应该不简单，不知道echarts有没有直接融合颜色的配置，可以尝试线的颜色设置透明度(毕竟底层原理还是canvas，不同颜色叠加是自动有融合效果的)。

除了在颜色上做手脚外，还可以更改线的宽度，比如下面的线，宽度比上面的宽一点，这样上面的就不能完全覆盖下面的了。

已参与了 SegmentFault 思否「问答」打卡，欢迎正在阅读的你也加入。

Answer 2

第一部分的数据的 linestyle 加上 width:4
其他补充方法，
1.视觉引导可以加上legend
2.分上下位置增加label显示
3.使用双列柱形图替代

Answer 3

1. 增加图例 legend
2. 两个线条可以都用带透明度的颜色。

---

已参与了 SegmentFault 思否「问答」打卡，欢迎正在阅读的你也加入。

Answer 4

对于这样预期大范围重合的数据，在显示时，主要有这样一些组合方式保证数据的区分

1. 不同的线宽方式，越是底下的数据给越大的线宽，这样上面的数据显示不能完全覆盖下面的，从而显示出来
2. 上面的数据给透明设，越上面，相对约透明

上面的方法可以组合使用。

已参与了 SegmentFault 思否「问答」打卡，欢迎正在阅读的你也加入。