echarts 柱状图 年竖线分组

效果图

要修改的就是xAxis 里面的内容 arr2.legend是标题的数组 内容是一月到十二月

   xAxis: [
            {
              type: 'category',
              data: arr2.legend,
              axisLine: {
                lineStyle: {
                  type: 'dashed',
                  color: 'rgba(208, 255, 246, 0.7)'
                }
              }
            },
            {
              position: 'top', // 将分组x轴位置定至顶部
              offset: 0, // 偏移，使分组文字显示位置不与原x轴重叠
              axisLine: {
                show: false // 隐藏分组x轴的轴线
              },
              axisTick: {
                length: 200, // 延长刻度线做分组线
                inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                lineStyle: { color: '#D0FFF6' }, // 分组刻度线颜色
                interval(index, value) {
                  console.log(index, 11, new Date().getMonth())
                  if (new Date().getMonth() != 11) {
                    return index === new Date().getMonth() + 1 || index === 0
                  }
                }
              },
              axisLabel: {
                inside: true, // 使刻度名称相对轴线在上面与原x轴相接，默认在轴线下方
                interval: 0, // 强制显示全部刻度名
                color: '#fff',
                formatter(val, index) {
                  var _wid = window.innerWidth / 1200 // 1200这个数字请自行对着自己项目页面调试
                  var _pla = new Array(Number(_wid.toFixed(0))).fill(' ')
                  if (index === new Date().getMonth()) {
                    return _pla.join('') + new Date().getFullYear() + '年' // 今年
                  } else if (index === new Date().getMonth() + 1) {
                    const Year = new Date().getFullYear() - 1 // +是下一年 -是上一年
                    return _pla.join('') + Year + '年'
                  } else {
                    return ''
                  }
                }
              },
              data: arr2.legend
            }
          ],