echart条形图超多项列显示固定列超出部分滚动条滚动显示

主要需要设置

dataZoom

start: 1, end: 50 滚动条显示的固定位置，

width:4,滚动条调整宽度

id: 'dataZoomY', 如果是条形图需要设置此项

如果是x轴的柱状图设置;

 id: 'dataZoomX',

dataZoom: [
        //  {
        //     id: 'dataZoomX',
        //     type: 'inside',
        //     xAxisIndex: [0],
        //     filterMode: 'filter'
        // },
        {
            id: 'dataZoomY', 
            type: 'inside',
            yAxisIndex: [0],
            // filterMode: 'empty',
            // height: 120, 
            width:4,
            start: 1, end: 50
        }
        ],
        xAxis: [
          //Y轴的网格已值为准
          {
            type: "value",
            show: false,
          },
        ],
        series: [ 
...

 

设置　　

type: 'inside', 滚动条会不显示，但是鼠标直接拖拽可实现滚动显示下面的，需要注意的是这两种对鼠标滚轮都不是直接实现滚动的（网页的是鼠标放在区域内滚动滚轮直接滚动实现）