echarts toolbox 的datazoom提供了绘制放大的功能,但通过鼠标绘制只能进行放大
应需求放大与还原都通过鼠标行为实现,增加从右往左绘制时还原放大结果
demo
结果

重写datazoom的原型方法实现绘制事件的拦截
  const comp = myChart._model.getComponent('toolbox');
  const toolbox = myChart.getViewOfComponentModel(comp);
  const datazoom = toolbox._features.dataZoom;
  // 回退
  //datazoom.onclick(datazoom.ecModel,datazoom.api,'back');
  // 记录x的起始位置
  let x = -1;
  // 重写放大回调
  const onBrush = datazoom.constructor.prototype._onBrush;
  datazoom.constructor.prototype._onBrush = function (evt) {
    if(x===-1){
      x = evt.areas[0].range[0][0];
    }
    if(evt.isEnd){
      const zoomin = evt.areas[0].range[0][0]-x <0;
      // 从右往左绘制返回放大前
      if(zoomin){
        this._brushController.updateCovers([]); // 清除绘制区域
        this.onclick(this.ecModel,this.api, 'back');
      }else{
        onBrush.call(this, evt);
      }
      x = -1;
    }else{
      onBrush.call(this, evt);
    }
  };
  // 重写原型链方法后,需要重新创建datazoom对象。因为重写前创建的datazoom对象会执行原先的原型方法
  // 还原
  myChart._api.dispatchAction({
    type: 'restore',
    from: myChart.id
  });



















