ECharts中splitLine按interval设置时单非空值不显示问题

问题场景 #

需求为：当X轴标签不为空字符串时，在标签下方显示splitLine。实际表现：

• 存在多个非空标签时，splitLine显示正常；
• 仅存在一个非空标签时，splitLine不显示，且出现对齐到图表左侧的异常。

复现代码 #

option = {
  xAxis: {
    type: 'category',
    position: 'top',
    data: ['', '', '', 'aaa', 'bbb'],
    splitLine: {
      show: true,
      interval: function(index, value) {
        return value != '';
      }
    }
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [150, 230, 224, 147, 260],
      type: 'line'
    }
  ]
}

问题原因 #

该问题是ECharts官方已知Bug，对应官方Issue编号19247。

内容的提问来源于stack exchange，提问作者calabasssita