echarts 多系列柱状图

Posted 2023-03-20

参考技术A 内置有导出图片，数据视图，动态类型切换，数据区域缩放，重置五个工具。

echarts 柱状图由于数据太多导致数组柱重叠

参考技术A 使用echarts 柱状图 犹豫x轴上的数据太多，导致柱状图叠在一起

我的解决办法是

X=x轴上的数据组

var namenum=Math.floor(100/(X.length/5));         //  这个5  可以顺便调整    是用来判断当前视图要显示几个

       if (X.length>6)                                          //  6也可以调整     用来判断是否显示滚动条

            var showEchart=true;

          else

            var showEchart=false;

          ,

  dataZoom: [                      //   这是滚动条

   

        show: showEchart,  // 是否展示

        xAxisIndex: [0],  // 控制第一个x轴

        height: 15,

        left: 100,

        right: 100,

        bottom: 0,

        start: 0,  // 数据窗口范围的起始百分比。范围是：0 ~ 100。表示 0% ~ 100%。

        end: namenum,  // 数据窗口范围的结束百分比。范围是：0 ~ 100。

        handleSize: "110%",

        zoomLock: true, //是否锁定选择区域（或叫做数据窗口）的大小。如果设置为 true

    ,

    ]

改过之后

可以进行滚动条操作当前数据