ECharts dataZoom slider 数据过多时缩小显示范围

startValue endValue

slider有start/end和startValue/endValue两组属性可以设置。

其中start/end是设置百分比，不管多少数据都是根据start/end的设置来调整。

而startValue和endValue是根据数组的索引来设置，当设置了0-29时如果数据不足30条则全部展示，当数据大于30条时则缩小到前30条的显示范围。

重要：一定要配置filterMode: 'none'，否则只会加载stratValue到endValue长度的数据。

这配置有效的解决了数据过多时图形拥挤的问题。

代码

const option = {
  dataZoom: [
    {
      type: 'slider',
      bottom: '6%',
      height: 20,
      startValue: 0,
      endValue: 35,
      filterMode: 'none',
    },
  ],
}

参考

https://echarts.apache.org/zh/option.html#dataZoom-slider.filterMode