使用echarts制作对比图表。

最近的项目中使用了比较图表。为了以后不到处找资料,记录了对比图的做法。

对比图实际上是一组水平直方图,X轴为度量,Y轴为维度。与echarts官方给出的例子不同,X轴的左右两边一般需要为正。在这种情况下,可以建立三个坐标系:第一个坐标系对应左侧部分(X轴设置为逆),第二个坐标系对应右侧部分,两个坐标系都隐藏Y轴,第三个坐标系用于显示Y轴(Y轴一般放在左侧,但也可以适当放在右侧),隐藏X轴。如图所示

Datazoom也被添加到比较图中,以链接三个Y轴。

最后,美中不足的是。当鼠标移入时,工具提示只能暂时显示某一面的内容。如果加个坐标系,可能就解决了。...