首页 > 其他分享 >echarts图表过程,显示滚动条并实现滚轮滚动

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

时间:2022-09-22 20:23:02浏览次数:53  
标签:滚轮 205 dataZoom 滚动条 rgba false true 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
        }]

  

标签:滚轮,205,dataZoom,滚动条,rgba,false,true,echarts
From: https://www.cnblogs.com/bagexiaowenti/p/16720743.html

相关文章