echarts图表过程,显示滚动条并实现滚轮滚动

let dataZoom = [
        {
          id: 'dataZoomY',
          yAxisIndex: [0],
          show: true, //是否显示滑动条,不影响使用
          type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
          startValue: 0, // 从头开始。
          endValue: 4, // 一次性展示5个
          width: 6,
          borderColor: 'transparent',
          fillerColor: 'rgba(205,205,205,1)',
          zoomLock: true,
          showDataShadow: false, //是否显示数据阴影 默认auto
          backgroundColor: '#fff',
          showDetail: false, //即拖拽时候是否显示详细数值信息 默认true
          realtime: true, //是否实时更新
          filterMode: 'filter',
          handleIcon: 'circle',
          handleStyle: {
            color: 'rgba(205,205,205,1)',
            borderColor: 'rgba(205,205,205,1)',
          },
          handleSize: '80%',
          moveHandleSize: 0,
          maxValueSpan: 4,
          minValueSpan: 4,
          brushSelect: false, //刷选功能,设为false可以防止拖动条长度改变 ************(这是一个坑)
        }, {
            type:'inside',
            yAxisIndex:0,
            zoomOnMouseWheel:false,  //滚轮是否触发缩放
            moveOnMouseMove:true,  //鼠标滚轮触发滚动
            moveOnMouseWheel:true
        }]

  

posted @ 2022-09-22 20:11  井凉一一  阅读(1998)  评论(0编辑  收藏  举报