解决ECharts 因X轴数据过多导致重叠显示不全的问题

X轴 加滚动条
　　通过配置合适的起始位置和结束位置可以做到数据过多不重叠，数据太少也不至于很丑，定位合适的位置后还可以通过手动拉伸滚动条的长度动态的显示不同条目数，对于动态的条目数滚动条要比倾斜数据灵活太多尤其是根据时间段动态显示数据，仅此表示个人观点，强烈推荐。

option = {
    xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],

    },
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [820, 932, 901, 934, 1290, 1330, 1320],
        type: 'line'
    }],
    dataZoom:{
      realtime:true, //拖动滚动条时是否动态的更新图表数据
      height:25,//滚动条高度
      start:40,//滚动条开始位置（共100等份）
      end:65//结束位置（共100等份）
   }  
};

X轴 类目名倾斜（Y轴同样适用）

option = {
    xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
        axisLabel:{
         interval:0,//0：全部显示，1：间隔为1显示对应类目，2：依次类推，（简单试一下就明白了，这样说是不是有点抽象）
         rotate:-30,//倾斜显示，-：顺时针旋转，+或不写：逆时针旋转
        }
    },
    yAxis: {
        type: 'value',
        axisLabel:{
         interval:0,//0：全部显示，1：间隔为1显示对应类目，2：依次类推，（简单试一下就明白了，这样说是不是有点抽象）
         rotate:-30,//倾斜显示，-：顺时针旋转，+或不写：逆时针旋转
        }
    },
    grid: {
         left: '10%',//因旋转导致名字太长的类目造成遮蔽，可以配合这两个属性
         bottom:'10%'// 分别表示：距离左边距和底部的距离，具体数值按实际情况调整
    },
    series: [{
        data: [820, 932, 901, 934, 1290, 1330, 1320],
        type: 'line'
    }],

};

X轴 类目名竖排显示
参考：https://blog.csdn.net/kebi007/article/details/68488694

option = {
    xAxis: {
        type: 'category',
        data: ['Maf', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
        axisLabel: {
            interval: 0,
            formatter:function(value)
            {

                var ret = "";//拼接加\n返回的类目项
                var maxLength = 2;//每项显示文字个数
                var valLength = value.length;//X轴类目项的文字个数
                var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
                if (rowN > 1)//如果类目项的文字大于3,
                {
                    for (var i = 0; i < rowN; i++) {
                        var temp = "";//每次截取的字符串
                        var start = i * maxLength;//开始截取的位置
                        var end = start + maxLength;//结束截取的位置
                        //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
                        temp = value.substring(start, end) + "\n";
                        ret += temp; //凭借最终的字符串
                    }
                    return ret;
                }
                else {
                    return value;
                }
            }
        }
    },
    yAxis: {
        type: 'value',
    },
    series: [{
        data: [820, 932, 901, 934, 1290, 1330, 1320],
        type: 'line'
    }],

};