解决Echarts2竖直datazoom滑动后显示数据不全的问题

在ECharts 2.x版本中，由于其DataZoom组件的交互方式，当它垂直展示并允许滑动时，可能会出现数据滚动不完全的问题，特别是当可视区域高度不足以显示全部数据时。解决这个问题的一般做法是调整DataZoom的position属性以及dataZoom组件的大小。

1. **调整位置**：将`dataZoom`的`orient`属性从默认的`'vertical'`更改为`'horizontal'`，让数据缩放条水平放置，这样通常能避免数据滚动不全的情况。

option = {
  dataZoom: {
    orient: 'horizontal', // 改为水平方向
    ...其他配置...
  },
  ...其他配置...
};

2. **自适应大小**：如果需要保持垂直方向，可以在窗口大小改变时动态调整DataZoom的高度。可以通过监听图表的resize事件，并根据新的视口高度重新计算DataZoom的高度。

myChart.on('resize', function() {
  var viewWidth = myChart.getWidth();
  var height = ...; // 根据你的数据和图表布局计算合适的高度
  option.dataZoom.height = height;
});

3. **限制缩放范围**：还可以设置`dataZoom.start`和`end`的值，防止用户缩放得过大导致数据丢失。

option.dataZoom = {
  start: 0,
  end: 100, // 或者根据实际需求设置最大缩放比例
  ...其他配置...
};