echarts 图例之间的间距怎么设置

Posted 2023-03-28

1、打开echarts官方实例页面，点击第一个折线图。

2、进入页面后，可以看到数据比较少，所以横坐标文字全部都显示出来了。

3、修改左侧的option内容，在xAxis的data数组中再添加两行内容，同时，在series中添加对应数量的值。

4、运行后，可以看到x横坐标已经按照图形大小，自动间隔显示了文字。如果没有特殊要求，这个就可以满足当内容少时，全部显示横坐标文字，当内容多时，自动间隔显示文字。

5、在option的xAxis区域添加axisLabel:interval:0，这个语句的意思是，设置横坐标的文字全部显示，不间隔。

6、再次运行就可以看到横坐标的内容全部显示了，但是由于空间不够，内容都挤到一起去了。

7、将间隔值修改为5，axisLabel:interval:5，再次运行，就可以看到x横坐标内容已经按照要求间隔显示了。

参考技术A 在legend: 括号中，添加 itemGap:2 这个数字代表间距 自己调调试试

ECharts 柱状图之间的间距怎么调整的

在 series下的data下面输入barGap:'1%'(柱间距离，默认为柱形宽度的30%，可设固定值)

或barGap:1

但是看似可以设置的很小，但还是有个值的，比如说我的barGap设的1和8显示出来一样的。 参考技术A http://www.cnblogs.com/fanshuyao/p/6812312.html?utm_source=itdadao&utm_medium=referral