修改柱状图dataZoom，实现底部的滚动条

    dataZoom: [
      {
        type: "slider",
        show: true,
        height: 5,
        xAxisIndex: [0],
        bottom: 5,
        start: 3,
        end: 65,
        showDataShadow:false,
        textStyle: {
          color: "#fff",
        },
        backgroundColor: "transparent", // 设置背景颜色为透明
        borderColor: "transparent", // 设置边框颜色为透明
        fillerColor: "#75FBFF", // 设置滚动条颜色
        brushSelect: false,
        handleIcon:
          "path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5M36.9,35.8h-1.3z M27.8,35.8 h-1.3H27L27.8,35.8L27.8,35.8z", // 画一个圆形
        handleSize: "100%",
        handleStyle: {
          color: "rgba(21, 220, 247, 1)",
          borderWidth: 0,
        },
        backgroundColor: "rgba(38, 108, 252, 0.1)", //两边未选中的滑动条区域的颜色
        borderColor: "transparent",
        filterMode: "filter",
      },
    ],

最终样式