echarts的x轴显示不全的解决办法


echarts的x轴显示不全的解决办法

一、背景

  当x轴类目较多时,label显示时会自动间隔显示,也就是会隐藏掉中间的label,如下图:

 二、解决办法

  通过设置 xAxis.axisLabel.interval = 0 来解决,如下:

xAxis: {
  type: 'category',
  axisLabel: {
    interval: 0 //全部显示x轴
  } 
},

效果如下:

OK,vue+charts完整代码示例,见这里