Echarts柱状图barGap参数设置柱间距离不生效的问题
series-bar.barGap
是series
标签的一个参数,用于配置不同系列的柱与柱之间的柱间距离(数值为柱子宽度的百分比)。配置起来很简单的一个参数,但是会发现直接添加到series
标签后不生效,原因是没有把grid标签的top
、left
、bottom
、right
四个参数设置完,缺少一个都会导致barGap
的配置不生效。
不生效的代码:
var option = { grid: { left: "2%", right: 0, top: 0, containLabel: true, }, series: [ { type: "bar", barGap: "8%" } ] }
上面代码中的grid
少设置了bottom
,导致barGap
不生效。
会生效的代码:
var option = { grid: { left: "2%", right: 0, top: 0, bottom: 0, containLabel: true, }, series: [ { type: "bar", barGap: "8%" } ] }
上面代码中的grid
把bottom
补上了,barGap
生效。
grid
设置完成后,barGap
生效。
提示:left
、right
、top
、bottom
四个值根据自己的需要设置。