Echarts柱状图barGap参数设置柱间距离不生效的问题

series-bar.barGapseries标签的一个参数,用于配置不同系列的柱与柱之间的柱间距离(数值为柱子宽度的百分比)。配置起来很简单的一个参数,但是会发现直接添加到series标签后不生效,原因是没有把grid标签的topleftbottomright四个参数设置完,缺少一个都会导致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%"
		}
	]
}

上面代码中的gridbottom补上了,barGap生效。

grid设置完成后,barGap生效。

提示:leftrighttopbottom四个值根据自己的需要设置。