echarts 带滚轮的折线图 固定显示最后一条数据的横（x）轴坐标

        

 

        使用官网的滚动条时，我们会发现在展示整体数据的时候，最后一条数据的x轴坐标有时会显示出来，有时则因为与前一条数据间距过窄而被隐藏，但是项目要求整体展示的时候，固定显示第一条和最后一条数据的横（x）轴信息，我们只要设置下面的参数就可以实现啦~

xAxis:{ 
    axisLabel: {
         showMaxLabel: true,  //固定显示滚动条最后一条数据
    }
}

   同时注意不要在axisLabel中设置 interval: 0 属性，否则文字会挤到一起。

---

文字超出范围用...显示：

        

 

        在axisLabel中用formatter函数自定义文字显示形式，这里用到了substring函数，左开右闭截取指定长度的字符串。

xAxis: {
    axisLabel: {
        // x轴坐标文字样式
        fontSize: 14,
        color: '#666666',
        formatter: function(value) {
             //文字大于10个，只显示8个字，其余省略号显示
             let valueText = value.length > 10 ? value.substring(0,8) + "..." : value
             return valueText
        }
    },
    data: this.xData,
},