echarts 初次渲染先显示最后一项

1、按正常的做法，都是从左往右排（最左最新数据，对应右侧的顶部数据）

2、测试老大可能太闲，说不要这样的效果，他想初次进来显示最新的数据，而且是在x轴的左右边，看其他数据的需要往右滑动。

3、去官方文档看了看，有个倒排的属性：inverse，官方地址：https://echarts.apache.org/zh/option.html#xAxis.inverse

xAxis: [{
 type: 'category',
  boundaryGap: true,
  alignWithLabel: true,
  data: this.xData, // x轴数据
  splitNumber: 3,
  minInterval: 1,
  nameTextStyle: {
    width: 10
  },
  inverse: true, // 倒过来显示，先从x轴最右边显示
  axisLabel: {
    showMaxLabel: true, // 始终显示x轴最右侧
    // formatter: '{value}',
    formatter: function (value) { // 横轴文字显示换行回调
      var newParamsName = "";
      var paramsNameNumber = value.length;
      var provideNumber = 11;  // 一行显示几个字
      var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
      if (paramsNameNumber > provideNumber) {
        for (var p = 0; p < rowNumber; p++) {
          var tempStr = "";
          var start = p * provideNumber;
          var end = start + provideNumber;
          if (p == rowNumber - 1) {
            tempStr = value.substring(start, paramsNameNumber);
          } else {
            tempStr = value.substring(start, end) + "\n";
          }
          newParamsName += tempStr;
        }

      } else {
        newParamsName = value;
      }
      return newParamsName
    },
    textStyle: {
      color: '#fff'
    },
    interval: this.fast == "1" ? 500 : 700// 刻度间隔100条数据
  }
}],

4、还有一个细节：记得加上 showMaxLabel，官方文档：https://echarts.apache.org/zh/option.html#xAxis.axisLabel.showMaxLabel, 最后效果：

所有困难都是进阶的前奏！