在使用echarts制图时，会遇到多个柱子的数值显示在同一坐标系的情况，默认情况下如果柱子类别多，会重叠显示在坐标轴之上，并以左边对齐，如果两根柱子宽度不一就是如下显示，之后柱子的显示状态通过属性barGap进行调整（如果想要两根柱子堆叠放置可以通过将stack值设置为相等的值即可实现）
默认左边对齐
如下是barGap:'-85%'的样式 —— 此时的柱子可以通过调整值实现柱子的中线对齐
为负数时候两根柱子还有重合部分
如下是值为20%的样式
大于等于0%脱离重叠
以上方式虽然可以实现柱子的中线对齐，但是如果柱子种类数量大于二，那么通过调整barGap实现柱子中线对齐却是不容易的，而且通过属性调整会出现柱子对齐指示器却还是偏的现象，对于这种情况我有两种解决手段
一、我们可以通过使用象形图，series的type值为‘pictorialBar’,这个类型的series不管柱子的宽度差的多离谱，都会自动中线对齐
之后设置symbol类型为'rect',是否平铺为不平铺symbolRepeat: false（会自动拉伸为柱状），之后设置样式即可
一定要记得改
代码展示
二、第二种也是通过象形图的方式，但是这次是需要将图片设置为symbol的值，类似于给柱子添加图片背景
类型
、yellow即为图片地址
网友评论