echarts 数据多时 x坐标轴滚动

echarts做图表时有时会遇到数据多x坐标无法完全展示，如果强制完全展示又会显得非常拥挤，通过看官网得出以下设置：

option中设置：

数据平移条通过在options中的dataZoom属性来进行控制
 

数据平移条
    dataZoom: {
      // 开启数据平移
      type: 'slider', // 滑动条单独显示
      show: true, // 是否显示滑动条
      startValue: 0, // 展示区域内容的起始数值
      endValue: 16,// 展示区域内容的结束数值 当前展示x坐标下标为0-16
      height: 10, // 滑动条组件高度
      bottom: 0, // 距离图表区域下边的距离
      showDetail: false, // 拖拽时是否显示详情
      showDataShadow: false,
      fillerColor: '#D4D4D4', // 平移条的填充颜色
      borderColor: 'transparent', // 边框颜色
      zoomLock: true, // 锁定视图
      brushSelect: false, // 不可缩放 滑动条默认是有手柄可以进行展示的内容区域缩放的，不太美观
      // 通过该属性可以只滑动，不显示缩放功能
      handleStyle: {
        opacity: 0,
      },
      lineStyle: {
        opacity: 0,
      },
      textStyle: {
        fontSize: 0,
      },
    },

这样设置完就会得到一个类似于滚动条形式的平移条。