@visactor/vchart 1.13.9-alpha.10 → 1.13.9-alpha.11

package/build/index.es.js

@@ -31425,10 +31425,6 @@ const SCROLLBAR_START_EVENT = "scrollDown";
 const SCROLLBAR_EVENT$1 = "scrollDrag";
 const SCROLLBAR_END_EVENT$1 = "scrollUp";
 
-function getEndTriggersOfDrag() {
-  return "browser" === vglobal.env ? ["pointerup", "pointerleave", "pointercancel"] : ["pointerup", "pointerleave", "pointerupoutside"];
-}
-
 const delayMap$3 = {
   debounce: debounce,
   throttle: throttle
@@ -31461,7 +31457,6 @@ let ScrollBar$1 = class ScrollBar extends AbstractComponent {
       }
       this.setScrollRange([currentScrollValue - (range[1] - range[0]) / 2, currentScrollValue + (range[1] - range[0]) / 2], !1), this.stage && !this.stage.autoRender && this.stage.renderNextFrame();
     }, this._onSliderPointerDown = e => {
-      this._clearDragEvents();
       const {
         stopSliderDownPropagation = !0
       } = this.attribute;
@@ -31476,15 +31471,11 @@ let ScrollBar$1 = class ScrollBar extends AbstractComponent {
       this._prePos = "horizontal" === direction ? x : y, this._dispatchEvent(SCROLLBAR_START_EVENT, {
         pos: this._prePos,
         event: e
-      });
-      const triggers = getEndTriggersOfDrag(),
-        obj = "browser" === vglobal.env ? vglobal : this.stage;
-      obj.addEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
-        capture: !0,
-        passive: !0
-      }), triggers.forEach(trigger => {
-        obj.addEventListener(trigger, this._onSliderPointerUp);
-      });
+      }), "browser" === vglobal.env ? (vglobal.addEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
+        capture: !0
+      }), vglobal.addEventListener("pointerup", this._onSliderPointerUp)) : (this.stage.addEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
+        capture: !0
+      }), this.stage.addEventListener("pointerup", this._onSliderPointerUp), this.stage.addEventListener("pointerupoutside", this._onSliderPointerUp));
     }, this._computeScrollValue = e => {
       const {
           direction: direction
@@ -31502,7 +31493,6 @@ let ScrollBar$1 = class ScrollBar extends AbstractComponent {
       } = this.getSliderRenderBounds();
       return "vertical" === direction ? (currentPos = y, delta = currentPos - this._prePos, currentScrollValue = delta / height) : (currentPos = x, delta = currentPos - this._prePos, currentScrollValue = delta / width), [currentPos, currentScrollValue];
     }, this._onSliderPointerMove = e => {
-      e.preventDefault();
       const {
         stopSliderMovePropagation = !0
       } = this.attribute;
@@ -31511,6 +31501,7 @@ let ScrollBar$1 = class ScrollBar extends AbstractComponent {
         [currentPos, currentScrollValue] = this._computeScrollValue(e);
       this.setScrollRange([preScrollRange[0] + currentScrollValue, preScrollRange[1] + currentScrollValue], !0), this._prePos = currentPos;
     }, this._onSliderPointerMoveWithDelay = 0 === this.attribute.delayTime ? this._onSliderPointerMove : delayMap$3[this.attribute.delayType](this._onSliderPointerMove, this.attribute.delayTime), this._onSliderPointerUp = e => {
+      e.preventDefault();
       const {
           range: preRange,
           limitRange = [0, 1]
@@ -31521,7 +31512,11 @@ let ScrollBar$1 = class ScrollBar extends AbstractComponent {
       this._dispatchEvent(SCROLLBAR_END_EVENT$1, {
         pre: preRange,
         value: clampRange$1(range, limitRange[0], limitRange[1])
-      }), this._clearDragEvents();
+      }), "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
+        capture: !0
+      }), vglobal.removeEventListener("pointerup", this._onSliderPointerUp)) : (this.stage.removeEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
+        capture: !0
+      }), this.stage.removeEventListener("pointerup", this._onSliderPointerUp), this.stage.removeEventListener("pointerupoutside", this._onSliderPointerUp));
     };
   }
   setScrollRange(range) {
@@ -31670,16 +31665,6 @@ let ScrollBar$1 = class ScrollBar extends AbstractComponent {
       sliderSize = this._sliderSize;
     return "horizontal" === direction ? clampRange$1([x1 + min * width, x1 + max * width], x1, width - sliderSize) : clampRange$1([y1 + min * height, y1 + max * height], y1, height - sliderSize);
   }
-  _clearDragEvents() {
-    const triggers = getEndTriggersOfDrag(),
-      obj = "browser" === vglobal.env ? vglobal : this.stage;
-    obj.removeEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
-      capture: !0,
-      passive: !1
-    }), triggers.forEach(trigger => {
-      obj.removeEventListener(trigger, this._onSliderPointerUp);
-    });
-  }
   _reset() {
     this._sliderRenderBounds = null, this._sliderLimitRange = null;
   }
@@ -39028,20 +39013,14 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
     }, this.state = {
       start: 0,
       end: 1
-    }, this._statePointToData = state => state, this._handleTouchMove = e => {
-      this._activeState && e.preventDefault();
-    }, this._onHandlerPointerDown = (e, tag) => {
-      this._clearDragEvents(), "start" === tag ? (this._activeTag = DataZoomActiveTag.startHandler, this._activeItem = this._startHandlerMask) : "end" === tag ? (this._activeTag = DataZoomActiveTag.endHandler, this._activeItem = this._endHandlerMask) : "middleRect" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler, this._activeItem = this._middleHandlerRect) : "middleSymbol" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler, this._activeItem = this._middleHandlerSymbol) : "background" === tag && (this._activeTag = DataZoomActiveTag.background, this._activeItem = this._background), this._activeState = !0, this._activeCache.startPos = this.eventPosToStagePos(e), this._activeCache.lastPos = this.eventPosToStagePos(e);
-      const evtTarget = "browser" === vglobal.env ? vglobal : this.stage,
-        triggers = getEndTriggersOfDrag();
-      evtTarget.addEventListener("pointermove", this._onHandlerPointerMove, {
-        capture: !0,
-        passive: !1
-      }), triggers.forEach(trigger => {
-        evtTarget.addEventListener(trigger, this._onHandlerPointerUp);
+    }, this._statePointToData = state => state, this._onHandlerPointerDown = (e, tag) => {
+      e.stopPropagation(), "start" === tag ? (this._activeTag = DataZoomActiveTag.startHandler, this._activeItem = this._startHandlerMask) : "end" === tag ? (this._activeTag = DataZoomActiveTag.endHandler, this._activeItem = this._endHandlerMask) : "middleRect" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler, this._activeItem = this._middleHandlerRect) : "middleSymbol" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler, this._activeItem = this._middleHandlerSymbol) : "background" === tag && (this._activeTag = DataZoomActiveTag.background, this._activeItem = this._background), this._activeState = !0, this._activeCache.startPos = this.eventPosToStagePos(e), this._activeCache.lastPos = this.eventPosToStagePos(e), "browser" === vglobal.env && (vglobal.addEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), vglobal.addEventListener("pointerup", this._onHandlerPointerUp)), this.addEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
       });
     }, this._pointerMove = e => {
-      e.preventDefault();
+      e.stopPropagation();
       const {
           start: startAttr,
           end: endAttr,
@@ -39058,12 +39037,13 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
         start: start,
         end: end
       } = this.state;
-      this._activeState && (this._activeTag === DataZoomActiveTag.middleHandler ? this.moveZoomWithMiddle((this.state.start + this.state.end) / 2 + dis) : this._activeTag === DataZoomActiveTag.startHandler ? start + dis > end ? (start = end, end = start + dis, this._activeTag = DataZoomActiveTag.endHandler) : start += dis : this._activeTag === DataZoomActiveTag.endHandler && (end + dis < start ? (end = start, start = end + dis, this._activeTag = DataZoomActiveTag.startHandler) : end += dis), brushSelect && this.renderDragMask()), start = Math.min(Math.max(start, 0), 1), end = Math.min(Math.max(end, 0), 1), startAttr === start && endAttr === end || (this._activeCache.lastPos = pos, this.setStateAttr(start, end, !0), realTime && this._dispatchEvent("change", {
+      this._activeState && (this._activeTag === DataZoomActiveTag.middleHandler ? this.moveZoomWithMiddle((this.state.start + this.state.end) / 2 + dis) : this._activeTag === DataZoomActiveTag.startHandler ? start + dis > end ? (start = end, end = start + dis, this._activeTag = DataZoomActiveTag.endHandler) : start += dis : this._activeTag === DataZoomActiveTag.endHandler && (end + dis < start ? (end = start, start = end + dis, this._activeTag = DataZoomActiveTag.startHandler) : end += dis), this._activeCache.lastPos = pos, brushSelect && this.renderDragMask()), start = Math.min(Math.max(start, 0), 1), end = Math.min(Math.max(end, 0), 1), startAttr === start && endAttr === end || (this.setStateAttr(start, end, !0), realTime && this._dispatchEvent("change", {
         start: start,
         end: end,
         tag: this._activeTag
       }));
     }, this._onHandlerPointerMove = 0 === this.attribute.delayTime ? this._pointerMove : delayMap$2[this.attribute.delayType](this._pointerMove, this.attribute.delayTime), this._onHandlerPointerUp = e => {
+      e.preventDefault();
       const {
         start: start,
         end: end,
@@ -39078,7 +39058,11 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
         start: this.state.start,
         end: this.state.end,
         tag: this._activeTag
-      }), this._clearDragEvents();
+      }), "browser" === vglobal.env && (vglobal.removeEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), vglobal.removeEventListener("pointerup", this._onHandlerPointerUp)), this.removeEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), this.removeEventListener("pointerup", this._onHandlerPointerUp);
     };
     const {
       position: position,
@@ -39097,9 +39081,7 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
     } = this.attribute;
     this._startHandlerMask && this._startHandlerMask.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "start")), this._endHandlerMask && this._endHandlerMask.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "end")), this._middleHandlerSymbol && this._middleHandlerSymbol.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "middleSymbol")), this._middleHandlerRect && this._middleHandlerRect.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "middleRect"));
     const selectedTag = brushSelect ? "background" : "middleRect";
-    this._selectedBackground && this._selectedBackground.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, selectedTag)), brushSelect && this._background && this._background.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "background")), brushSelect && this._previewGroup && this._previewGroup.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "background")), this._selectedPreviewGroup && this._selectedPreviewGroup.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, selectedTag)), "auto" === showDetail && (this.addEventListener("pointerenter", this._onHandlerPointerEnter), this.addEventListener("pointerleave", this._onHandlerPointerLeave)), ("browser" === vglobal.env ? vglobal : this.stage).addEventListener("touchmove", this._handleTouchMove, {
-      passive: !1
-    });
+    this._selectedBackground && this._selectedBackground.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, selectedTag)), brushSelect && this._background && this._background.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "background")), brushSelect && this._previewGroup && this._previewGroup.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, "background")), this._selectedPreviewGroup && this._selectedPreviewGroup.addEventListener("pointerdown", e => this._onHandlerPointerDown(e, selectedTag)), this.addEventListener("pointerup", this._onHandlerPointerUp), this.addEventListener("pointerupoutside", this._onHandlerPointerUp), "auto" === showDetail && (this.addEventListener("pointerenter", this._onHandlerPointerEnter), this.addEventListener("pointerleave", this._onHandlerPointerLeave));
   }
   dragMaskSize() {
     const {
@@ -39130,21 +39112,11 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
       y: 0
     };
   }
-  _clearDragEvents() {
-    const evtTarget = "browser" === vglobal.env ? vglobal : this.stage,
-      triggers = getEndTriggersOfDrag();
-    evtTarget.removeEventListener("pointermove", this._onHandlerPointerMove, {
-      capture: !0,
-      passive: !1
-    }), triggers.forEach(trigger => {
-      evtTarget.removeEventListener(trigger, this._onHandlerPointerUp);
-    });
-  }
   _onHandlerPointerEnter(e) {
-    this._showText = !0, this.renderText();
+    e.stopPropagation(), this._showText = !0, this.renderText();
   }
   _onHandlerPointerLeave(e) {
-    this._showText = !1, this.renderText();
+    e.stopPropagation(), this._showText = !1, this.renderText();
   }
   backgroundDragZoom(startPos, endPos) {
     const {
@@ -39683,11 +39655,6 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
   setStatePointToData(callback) {
     isFunction$1(callback) && (this._statePointToData = callback);
   }
-  release(all) {
-    super.release(all), ("browser" === vglobal.env ? vglobal : this.stage).addEventListener("touchmove", this._handleTouchMove, {
-      passive: !1
-    }), this._clearDragEvents();
-  }
 };
 DataZoom$1.defaultAttributes = DEFAULT_DATA_ZOOM_ATTRIBUTES;
 
@@ -42629,23 +42596,19 @@ class Slider extends AbstractComponent {
       } = this.attribute;
       tooltip && tooltip.alwaysShow || (this._tooltipState = null, this._tooltipShape && this._tooltipShape.setAttribute("visible", !1), this._tooltipText && this._tooltipText.setAttribute("visible", !1), this._dispatchTooltipEvent("sliderTooltipHide"));
     }, this._onHandlerPointerdown = e => {
-      this._clearAllDragEvents(), this._isChanging = !0;
+      e.stopPropagation(), this._isChanging = !0;
       const {
         x: x,
         y: y
       } = this.stage.eventPointTransform(e);
-      this._currentHandler = e.target, this._prePos = this._isHorizontal ? x : y;
-      const triggers = getEndTriggersOfDrag(),
-        obj = "browser" === vglobal.env ? vglobal : this.stage;
-      obj.addEventListener("pointermove", this._onHandlerPointerMove, {
-        capture: !0,
-        passive: !1
-      }), triggers.forEach(trigger => {
-        obj.addEventListener(trigger, this._onHandlerPointerUp);
-      });
+      this._currentHandler = e.target, this._prePos = this._isHorizontal ? x : y, "browser" === vglobal.env ? (vglobal.addEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), vglobal.addEventListener("pointerup", this._onHandlerPointerUp)) : (this.stage.addEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), this.stage.addEventListener("pointerup", this._onHandlerPointerUp), this.stage.addEventListener("pointerupoutside", this._onHandlerPointerUp));
     }, this._onHandlerPointerMove = e => {
       var _a, _b;
-      e.preventDefault(), this._isChanging = !0;
+      e.stopPropagation(), this._isChanging = !0;
       const {
         railWidth: railWidth,
         railHeight: railHeight,
@@ -42666,26 +42629,24 @@ class Slider extends AbstractComponent {
         currentValue = this.calculateValueByPos(newPos);
       "text" === this._currentHandler.type ? this._updateHandlerText(this._currentHandler, newPos, currentValue) : this._updateHandler(this._currentHandler, newPos, currentValue), this._updateTrack(), this._prePos = currentPos, this._dispatchChangeEvent();
     }, this._onHandlerPointerUp = e => {
-      this._isChanging = !1, this._currentHandler = null, this._clearAllDragEvents();
-    }, this._handleTouchMove = e => {
-      this._isChanging && e.preventDefault();
+      e.preventDefault(), this._isChanging = !1, this._currentHandler = null, "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), vglobal.removeEventListener("pointerup", this._onHandlerPointerUp)) : (this.stage.removeEventListener("pointermove", this._onHandlerPointerMove, {
+        capture: !0
+      }), this.stage.removeEventListener("pointerup", this._onHandlerPointerUp), this.stage.removeEventListener("pointerupoutside", this._onHandlerPointerUp));
     }, this._onTrackPointerdown = e => {
-      this._clearAllDragEvents(), this._isChanging = !0;
+      e.stopPropagation(), this._isChanging = !0;
       const {
         x: x,
         y: y
       } = this.stage.eventPointTransform(e);
-      this._prePos = this._isHorizontal ? x : y;
-      const triggers = getEndTriggersOfDrag(),
-        obj = "browser" === vglobal.env ? vglobal : this.stage;
-      obj.addEventListener("pointermove", this._onTrackPointerMove, {
-        capture: !0,
-        passive: !1
-      }), triggers.forEach(trigger => {
-        obj.addEventListener(trigger, this._onTrackPointerUp);
-      });
+      this._prePos = this._isHorizontal ? x : y, "browser" === vglobal.env ? (vglobal.addEventListener("pointermove", this._onTrackPointerMove, {
+        capture: !0
+      }), vglobal.addEventListener("pointerup", this._onTrackPointerUp)) : (this.stage.addEventListener("pointermove", this._onTrackPointerMove, {
+        capture: !0
+      }), this.stage.addEventListener("pointerup", this._onTrackPointerUp), this.stage.addEventListener("pointerupoutside", this._onTrackPointerUp));
     }, this._onTrackPointerMove = e => {
-      e.preventDefault(), this._isChanging = !0;
+      e.stopPropagation(), this._isChanging = !0;
       const {
         railWidth: railWidth,
         railHeight: railHeight,
@@ -42726,9 +42687,13 @@ class Slider extends AbstractComponent {
       }
       this._prePos = currentPos, this._dispatchChangeEvent();
     }, this._onTrackPointerUp = e => {
-      this._isChanging = !1, this._clearAllDragEvents();
+      e.preventDefault(), this._isChanging = !1, "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onTrackPointerMove, {
+        capture: !0
+      }), vglobal.removeEventListener("pointerup", this._onTrackPointerUp)) : (this.stage.removeEventListener("pointermove", this._onTrackPointerMove, {
+        capture: !0
+      }), this.stage.removeEventListener("pointerup", this._onTrackPointerUp), this.stage.removeEventListener("pointerupoutside", this._onTrackPointerUp));
     }, this._onRailPointerDown = e => {
-      this._clearAllDragEvents(), this._isChanging = !0;
+      e.stopPropagation(), this._isChanging = !0;
       const {
         railWidth: railWidth,
         railHeight: railHeight,
@@ -43049,28 +43014,11 @@ class Slider extends AbstractComponent {
       slidable: slidable,
       range: range
     } = this.attribute;
-    slidable && (this._startHandler && this._startHandler.addEventListener("pointerdown", this._onHandlerPointerdown), this._startHandlerText && this._startHandlerText.addEventListener("pointerdown", this._onHandlerPointerdown), this._endHandler && this._endHandler.addEventListener("pointerdown", this._onHandlerPointerdown), this._endHandlerText && this._endHandlerText.addEventListener("pointerdown", this._onHandlerPointerdown), isObject$2(range) && range.draggableTrack && this._track.addEventListener("pointerdown", this._onTrackPointerdown), this._railContainer.addEventListener("pointerdown", this._onRailPointerDown), ("browser" === vglobal.env ? vglobal : this.stage).addEventListener("touchmove", this._handleTouchMove, {
-      passive: !1
-    }));
+    slidable && (this._startHandler && this._startHandler.addEventListener("pointerdown", this._onHandlerPointerdown), this._startHandlerText && this._startHandlerText.addEventListener("pointerdown", this._onHandlerPointerdown), this._endHandler && this._endHandler.addEventListener("pointerdown", this._onHandlerPointerdown), this._endHandlerText && this._endHandlerText.addEventListener("pointerdown", this._onHandlerPointerdown), isObject$2(range) && range.draggableTrack && this._track.addEventListener("pointerdown", this._onTrackPointerdown), this._railContainer.addEventListener("pointerdown", this._onRailPointerDown));
   }
   _bindTooltipEvents() {
     this.attribute.disableTriggerEvent || (this._mainContainer.addEventListener("pointerenter", this._onTooltipShow), this._mainContainer.addEventListener("pointermove", this._onTooltipUpdate), this._mainContainer.addEventListener("pointerleave", this._onTooltipHide));
   }
-  _clearAllDragEvents() {
-    const triggers = getEndTriggersOfDrag(),
-      obj = "browser" === vglobal.env ? vglobal : this.stage;
-    obj.removeEventListener("pointermove", this._onHandlerPointerMove, {
-      capture: !0,
-      passive: !1
-    }), triggers.forEach(trigger => {
-      obj.removeEventListener(trigger, this._onHandlerPointerUp);
-    }), obj.removeEventListener("pointermove", this._onTrackPointerMove, {
-      capture: !0,
-      passive: !1
-    }), triggers.forEach(trigger => {
-      obj.removeEventListener(trigger, this._onTrackPointerUp);
-    });
-  }
   _updateTrack() {
     const {
         inverse: inverse,
@@ -43169,11 +43117,6 @@ class Slider extends AbstractComponent {
       endHandler: endHandler
     };
   }
-  release(all) {
-    super.release(all), ("browser" === vglobal.env ? vglobal : this.stage).addEventListener("touchmove", this._handleTouchMove, {
-      passive: !1
-    }), this._clearAllDragEvents();
-  }
 }
 Slider.defaultAttributes = {
   slidable: !0,
@@ -44455,7 +44398,7 @@ var IOperateType;
 const DEFAULT_BRUSH_ATTRIBUTES = {
   trigger: "pointerdown",
   updateTrigger: "pointermove",
-  endTrigger: ["pointerup", "pointerleave"],
+  endTrigger: "pointerup",
   resetTrigger: "pointerupoutside",
   hasMask: !0,
   brushMode: "single",
@@ -44493,22 +44436,41 @@ let Brush$1 = class Brush extends AbstractComponent {
     super((null == options ? void 0 : options.skipDefault) ? attributes : merge$1({}, Brush.defaultAttributes, attributes)), this.name = "brush", this._activeDrawState = !1, this._cacheDrawPoints = [], this._isDrawedBeforeEnd = !1, this._isDownBeforeUpOutside = !1, this._activeMoveState = !1, this._operatingMaskMoveDx = 0, this._operatingMaskMoveDy = 0, this._operatingMaskMoveRangeX = [-1 / 0, 1 / 0], this._operatingMaskMoveRangeY = [-1 / 0, 1 / 0], this._brushMaskAABBBoundsDict = {}, this._onBrushStart = e => {
       var _a;
       if (this._outOfInteractiveRange(e)) return void (this._isDownBeforeUpOutside = !0);
-      this._isDownBeforeUpOutside = !1, e.stopPropagation();
+      e.stopPropagation();
       const brushMoved = null === (_a = this.attribute.brushMoved) || void 0 === _a || _a;
       this._activeMoveState = brushMoved && this._isPosInBrushMask(e), this._activeDrawState = !this._activeMoveState, this._activeDrawState && this._initDraw(e), this._activeMoveState && this._initMove(e);
     }, this._onBrushing = e => {
       this._outOfInteractiveRange(e) || ((this._activeDrawState || this._activeMoveState) && e.stopPropagation(), this._activeDrawState && this._drawing(e), this._activeMoveState && this._moving(e));
     }, this._onBrushingWithDelay = 0 === this.attribute.delayTime ? this._onBrushing : delayMap$1[this.attribute.delayType](this._onBrushing, this.attribute.delayTime), this._onBrushEnd = e => {
       var _a;
-      if (this._isDownBeforeUpOutside) return this._isEmptyMask() || (this._clearMask(), this._dispatchBrushEvent(IOperateType.brushClear, e)), void (this._isDownBeforeUpOutside = !1);
       if (!this._activeDrawState && !this._activeMoveState) return;
       e.preventDefault();
       const {
         removeOnClick = !0
       } = this.attribute;
-      this._activeDrawState && !this._isDrawedBeforeEnd && removeOnClick ? (null === (_a = this._operatingMask) || void 0 === _a ? void 0 : _a._AABBBounds.empty()) ? this._isEmptyMask() || (this._clearMask(), this._dispatchBrushEvent(IOperateType.brushClear, e)) : (delete this._brushMaskAABBBoundsDict[this._operatingMask.name], this._container.setAttributes({}), this._container.removeChild(this._operatingMask), this._isEmptyMask() ? this._dispatchBrushEvent(IOperateType.drawEnd, e) : this._dispatchBrushEvent(IOperateType.brushClear, e)) : (this._activeDrawState && this._dispatchBrushEvent(IOperateType.drawEnd, e), this._activeMoveState && this._dispatchBrushEvent(IOperateType.moveEnd, e)), this._activeDrawState = !1, this._activeMoveState = !1, this._isDrawedBeforeEnd = !1, this._operatingMask && this._operatingMask.setAttribute("pickable", !1);
+      this._activeDrawState && !this._isDrawedBeforeEnd && removeOnClick ? ((null === (_a = this._operatingMask) || void 0 === _a ? void 0 : _a._AABBBounds.empty()) && this._dispatchEvent(IOperateType.brushClear, {
+        operateMask: this._operatingMask,
+        operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+        event: e
+      }), this._container.incrementalClearChild(), this._brushMaskAABBBoundsDict = {}) : (this._activeDrawState && this._dispatchEvent(IOperateType.drawEnd, {
+        operateMask: this._operatingMask,
+        operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+        event: e
+      }), this._activeMoveState && this._dispatchEvent(IOperateType.moveEnd, {
+        operateMask: this._operatingMask,
+        operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+        event: e
+      })), this._activeDrawState = !1, this._activeMoveState = !1, this._isDrawedBeforeEnd = !1, this._operatingMask && this._operatingMask.setAttribute("pickable", !1);
     }, this._onBrushClear = e => {
-      e.preventDefault(), this._isEmptyMask() || (this._clearMask(), this._dispatchBrushEvent(IOperateType.brushClear, e)), this._activeDrawState = !1, this._activeMoveState = !1, this._isDrawedBeforeEnd = !1, this._isDownBeforeUpOutside = !1;
+      e.preventDefault();
+      const {
+        removeOnClick = !0
+      } = this.attribute;
+      this._isDownBeforeUpOutside && removeOnClick && (this._dispatchEvent(IOperateType.brushClear, {
+        operateMask: this._operatingMask,
+        operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+        event: e
+      }), this._container.incrementalClearChild(), this._brushMaskAABBBoundsDict = {}), this._activeDrawState = !1, this._activeMoveState = !1, this._isDrawedBeforeEnd = !1, this._isDownBeforeUpOutside = !1, this._operatingMask && this._operatingMask.setAttribute("pickable", !1);
     };
   }
   _bindBrushEvents() {
@@ -44519,14 +44481,35 @@ let Brush$1 = class Brush extends AbstractComponent {
       endTrigger = DEFAULT_BRUSH_ATTRIBUTES.endTrigger,
       resetTrigger = DEFAULT_BRUSH_ATTRIBUTES.resetTrigger
     } = this.attribute;
-    array(trigger).forEach(t => this.stage.addEventListener(t, this._onBrushStart)), array(updateTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushingWithDelay)), array(endTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushEnd)), array(resetTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushClear));
+    array(trigger).forEach(t => vglobal.addEventListener(t, this._onBrushStart)), array(updateTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushingWithDelay)), array(endTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushEnd)), array(resetTrigger).forEach(t => this.stage.addEventListener(t, this._onBrushClear));
+  }
+  _isPosInBrushMask(e) {
+    const pos = this.eventPosToStagePos(e),
+      brushMasks = this._container.getChildren();
+    for (let i = 0; i < brushMasks.length; i++) {
+      const {
+          points = [],
+          dx = 0,
+          dy = 0
+        } = brushMasks[i].attribute,
+        pointsConsiderOffset = points.map(point => ({
+          x: point.x + dx,
+          y: point.y + dy
+        }));
+      if (polygonContainPoint(pointsConsiderOffset, pos.x, pos.y)) return this._operatingMask = brushMasks[i], !0;
+    }
+    return !1;
   }
   _initDraw(e) {
     const {
         brushMode: brushMode
       } = this.attribute,
       pos = this.eventPosToStagePos(e);
-    this._cacheDrawPoints = [pos], this._isDrawedBeforeEnd = !1, "single" === brushMode && this._clearMask(), this._addBrushMask(), this._dispatchBrushEvent(IOperateType.drawStart, e);
+    this._cacheDrawPoints = [pos], this._isDrawedBeforeEnd = !1, "single" === brushMode && (this._brushMaskAABBBoundsDict = {}, this._container.incrementalClearChild()), this._addBrushMask(), this._dispatchEvent(IOperateType.drawStart, {
+      operateMask: this._operatingMask,
+      operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+      event: e
+    });
   }
   _initMove(e) {
     var _a, _b;
@@ -44550,7 +44533,11 @@ let Brush$1 = class Brush extends AbstractComponent {
       maxMoveStepX = maxX - x2,
       minMoveStepY = minY - y1,
       maxMoveStepY = maxY - y2;
-    this._operatingMaskMoveRangeX = [minMoveStepX, maxMoveStepX], this._operatingMaskMoveRangeY = [minMoveStepY, maxMoveStepY], this._operatingMask.setAttribute("pickable", !0), this._dispatchBrushEvent(IOperateType.moveStart, e);
+    this._operatingMaskMoveRangeX = [minMoveStepX, maxMoveStepX], this._operatingMaskMoveRangeY = [minMoveStepY, maxMoveStepY], this._operatingMask.setAttribute("pickable", !0), this._dispatchEvent(IOperateType.moveStart, {
+      operateMask: this._operatingMask,
+      operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+      event: e
+    });
   }
   _drawing(e) {
     var _a, _b;
@@ -44573,7 +44560,11 @@ let Brush$1 = class Brush extends AbstractComponent {
       y1 = 0,
       y2 = 0
     } = null === (_b = this._operatingMask) || void 0 === _b ? void 0 : _b._AABBBounds;
-    this._isDrawedBeforeEnd = !this._operatingMask._AABBBounds.empty() && !!(Math.abs(x2 - x1) > sizeThreshold || Math.abs(y1 - y2) > sizeThreshold), this._isDrawedBeforeEnd && (this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds), this._dispatchBrushEvent(IOperateType.drawing, e);
+    this._isDrawedBeforeEnd = !this._operatingMask._AABBBounds.empty() && !!(Math.abs(x2 - x1) > sizeThreshold || Math.abs(y1 - y2) > sizeThreshold), this._isDrawedBeforeEnd && (this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds, this._dispatchEvent(IOperateType.drawing, {
+      operateMask: this._operatingMask,
+      operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+      event: e
+    }));
   }
   _moving(e) {
     const startPos = this._cacheMovePoint,
@@ -44586,21 +44577,11 @@ let Brush$1 = class Brush extends AbstractComponent {
     this._operatingMask.setAttributes({
       dx: moveX,
       dy: moveY
-    }), this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds, this._dispatchBrushEvent(IOperateType.moving, e);
-  }
-  render() {
-    this.releaseBrushEvents(), this._bindBrushEvents();
-    const group = this.createOrUpdateChild("brush-container", {}, "group");
-    this._container = group;
-  }
-  releaseBrushEvents() {
-    const {
-      trigger = DEFAULT_BRUSH_ATTRIBUTES.trigger,
-      updateTrigger = DEFAULT_BRUSH_ATTRIBUTES.updateTrigger,
-      endTrigger = DEFAULT_BRUSH_ATTRIBUTES.endTrigger,
-      resetTrigger = DEFAULT_BRUSH_ATTRIBUTES.resetTrigger
-    } = this.attribute;
-    array(trigger).forEach(t => this.stage.removeEventListener(t, this._onBrushStart)), array(updateTrigger).forEach(t => this.stage.removeEventListener(t, this._onBrushingWithDelay)), array(endTrigger).forEach(t => this.stage.removeEventListener(t, this._onBrushEnd)), array(resetTrigger).forEach(t => this.stage.removeEventListener(t, this._onBrushClear));
+    }), this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds, this._dispatchEvent(IOperateType.moving, {
+      operateMask: this._operatingMask,
+      operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+      event: e
+    });
   }
   _computeMaskPoints() {
     const {
@@ -44658,23 +44639,6 @@ let Brush$1 = class Brush extends AbstractComponent {
       }));
     brushMask.name = `brush-${Date.now()}`, this._operatingMask = brushMask, this._container.add(brushMask), this._brushMaskAABBBoundsDict[brushMask.name] = brushMask.AABBBounds;
   }
-  _isPosInBrushMask(e) {
-    const pos = this.eventPosToStagePos(e),
-      brushMasks = this._container.getChildren();
-    for (let i = 0; i < brushMasks.length; i++) {
-      const {
-          points = [],
-          dx = 0,
-          dy = 0
-        } = brushMasks[i].attribute,
-        pointsConsiderOffset = points.map(point => ({
-          x: point.x + dx,
-          y: point.y + dy
-        }));
-      if (polygonContainPoint(pointsConsiderOffset, pos.x, pos.y)) return this._operatingMask = brushMasks[i], !0;
-    }
-    return !1;
-  }
   _outOfInteractiveRange(e) {
     const {
         interactiveRange: interactiveRange
@@ -44691,18 +44655,21 @@ let Brush$1 = class Brush extends AbstractComponent {
   eventPosToStagePos(e) {
     return this.stage.eventPointTransform(e);
   }
-  _dispatchBrushEvent(operateType, e) {
-    this._dispatchEvent(operateType, {
-      operateMask: this._operatingMask,
-      operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
-      event: e
-    });
-  }
-  _clearMask() {
-    this._brushMaskAABBBoundsDict = {}, this._container.incrementalClearChild(), this._operatingMask = null;
+  render() {
+    this._bindBrushEvents();
+    const group = this.createOrUpdateChild("brush-container", {}, "group");
+    this._container = group;
   }
-  _isEmptyMask() {
-    return isEmpty(this._brushMaskAABBBoundsDict) || Object.keys(this._brushMaskAABBBoundsDict).every(key => this._brushMaskAABBBoundsDict[key].empty());
+  releaseBrushEvents() {
+    const {
+      delayType = "throttle",
+      delayTime = 0,
+      trigger = DEFAULT_BRUSH_ATTRIBUTES.trigger,
+      updateTrigger = DEFAULT_BRUSH_ATTRIBUTES.updateTrigger,
+      endTrigger = DEFAULT_BRUSH_ATTRIBUTES.endTrigger,
+      resetTrigger = DEFAULT_BRUSH_ATTRIBUTES.resetTrigger
+    } = this.attribute;
+    array(trigger).forEach(t => vglobal.removeEventListener(t, this._onBrushStart)), array(updateTrigger).forEach(t => this.stage.removeEventListener(t, this._onBrushingWithDelay)), array(endTrigger).forEach(t => this.stage.removeEventListener(t, this._onBrushEnd)), array(resetTrigger).forEach(t => this.stage.removeEventListener(t, this._onBrushClear));
   }
 };
 Brush$1.defaultAttributes = DEFAULT_BRUSH_ATTRIBUTES;
@@ -59588,6 +59555,9 @@ class BaseModel extends CompilableBase {
     }
     beforeRelease() {
     }
+    clear() {
+        this.getMarks().forEach(m => { var _a; return (_a = m.clear) === null || _a === void 0 ? void 0 : _a.call(m); });
+    }
     release() {
         var _a;
         this._releaseEvent();
@@ -61740,6 +61710,9 @@ class CompilableMark extends GrammarItem {
         }
         return undefined;
     }
+    clear() {
+        this._event.off(HOOK_EVENT.AFTER_DO_RENDER);
+    }
     release() {
         super.release();
         this.state.release();
@@ -63689,7 +63662,7 @@ const registerVChartCore = () => {
 };
 registerVChartCore();
 
-const version = "1.13.9-alpha.10";
+const version = "1.13.9-alpha.11";
 
 const addVChartProperty = (data, op) => {
     const context = op.beforeCall();
@@ -67836,6 +67809,9 @@ class AxisComponent extends BaseComponent {
             if (spec.label.state) {
                 axisAttrs.label.state = transformAxisLabelStateStyle(spec.label.state);
             }
+            if (isFunction$1(spec.label.dataFilter)) {
+                axisAttrs.label.dataFilter = (data, layer) => spec.label.dataFilter(data, layer, { vchart: this._option.globalInstance });
+            }
         }
         else {
             axisAttrs.label = {
@@ -67848,7 +67824,9 @@ class AxisComponent extends BaseComponent {
                 length: spec.tick.tickSize,
                 inside: spec.tick.inside,
                 alignWithLabel: spec.tick.alignWithLabel,
-                dataFilter: spec.tick.dataFilter
+                dataFilter: isFunction$1(spec.tick.dataFilter)
+                    ? (data) => spec.tick.dataFilter(data, { vchart: this._option.globalInstance })
+                    : undefined
             };
             if (spec.tick.style) {
                 axisAttrs.tick.style = isFunction$1(spec.tick.style)
@@ -71101,58 +71079,83 @@ class BaseChart extends CompilableBase {
             }
         });
     }
-    _setStateInDatum(stateKey, checkReverse, datum, filter, region) {
+    filterGraphicsByDatum(datum, opt = {}) {
+        var _a;
         datum = datum ? array(datum) : null;
         const keys = !datum ? null : Object.keys(datum[0]);
-        this.getRegionsInQuerier(region).forEach(r => {
-            if (!datum) {
-                r.interaction.clearEventElement(stateKey, true);
-                return;
-            }
-            r.getSeries().forEach(s => {
-                s.getMarks().forEach(m => {
-                    if (!m.getProduct()) {
-                        return;
-                    }
-                    if (!filter || (isFunction$1(filter) && filter(s, m))) {
-                        const isCollect = m.getProduct().isCollectionMark();
-                        const elements = m.getProduct().elements;
-                        let pickElements = [];
-                        if (isCollect) {
-                            pickElements = elements.filter(e => {
-                                const elDatum = e.getDatum();
-                                datum.every((d, index) => keys.every(k => d[k] == elDatum[index][k]));
-                            });
+        const allElements = [];
+        const getDatumOfElement = (_a = opt.getDatum) !== null && _a !== void 0 ? _a : ((el) => el.getDatum());
+        this.getRegionsInQuerier(opt.region).forEach(r => {
+            const pickElements = [];
+            datum &&
+                r.getSeries().forEach(s => {
+                    s.getMarks().forEach(m => {
+                        if (!m.getProduct()) {
+                            return;
                         }
-                        else {
-                            if (datum.length > 1) {
-                                const datumTemp = datum.slice();
-                                pickElements = elements.filter(e => {
-                                    if (datumTemp.length === 0) {
-                                        return false;
-                                    }
-                                    const elDatum = e.getDatum();
-                                    const index = datumTemp.findIndex(d => keys.every(k => d[k] == elDatum[k]));
-                                    if (index >= 0) {
-                                        datumTemp.splice(index, 1);
-                                        return true;
+                        if (!opt.filter || (isFunction$1(opt.filter) && opt.filter(s, m))) {
+                            const isCollect = m.getProduct().isCollectionMark();
+                            const elements = m.getProduct().elements;
+                            if (isCollect) {
+                                elements.filter(e => {
+                                    const elDatum = getDatumOfElement(e, m, s, r);
+                                    const isPick = elDatum && datum.every((d, index) => keys.every(k => d[k] == elDatum[index][k]));
+                                    if (isPick) {
+                                        pickElements.push(e);
+                                        allElements.push(e);
+                                        opt.callback && opt.callback(e, m, s, r);
                                     }
-                                    return false;
                                 });
                             }
                             else {
-                                const el = elements.find(e => keys.every(k => datum[0][k] == e.getDatum()[k]));
-                                el && (pickElements = [el]);
+                                if (datum.length > 1) {
+                                    const datumTemp = datum.slice();
+                                    elements.forEach(e => {
+                                        const elDatum = getDatumOfElement(e, m, s, r);
+                                        const index = elDatum && datumTemp.findIndex(d => keys.every(k => d[k] == elDatum[k]));
+                                        if (index >= 0) {
+                                            datumTemp.splice(index, 1);
+                                            pickElements.push(e);
+                                            allElements.push(e);
+                                            opt.callback && opt.callback(e, m, s, r);
+                                        }
+                                    });
+                                }
+                                else {
+                                    const el = elements.find(e => {
+                                        const elDatum = getDatumOfElement(e, m, s, r);
+                                        return elDatum && keys.every(k => datum[0][k] == elDatum[k]);
+                                    });
+                                    if (el) {
+                                        pickElements.push(el);
+                                        allElements.push(el);
+                                        opt.callback && opt.callback(el, m, s, r);
+                                    }
+                                }
                             }
                         }
-                        pickElements.forEach(element => {
-                            r.interaction.startInteraction(stateKey, element);
-                        });
-                    }
+                    });
                 });
-            });
-            if (checkReverse) {
-                r.interaction.reverseEventElement(stateKey);
+            opt.regionCallback && opt.regionCallback(pickElements, r);
+        });
+        return allElements;
+    }
+    _setStateInDatum(stateKey, checkReverse, datum, filter, region) {
+        this.filterGraphicsByDatum(datum, {
+            filter,
+            region,
+            regionCallback: (elements, r) => {
+                if (!datum) {
+                    r.interaction.clearEventElement(stateKey, true);
+                }
+                else if (elements.length) {
+                    elements.forEach(e => {
+                        r.interaction.startInteraction(stateKey, e);
+                    });
+                    if (checkReverse) {
+                        r.interaction.reverseEventElement(stateKey);
+                    }
+                }
             }
         });
     }
@@ -72752,9 +72755,7 @@ class BarSeries extends CartesianSeries {
                     else if (domainMin > 0) {
                         return scale.scale(domainMin);
                     }
-                    else {
-                        return scale.scale(0);
-                    }
+                    return scale.scale(0);
                 }
             }
         };
@@ -76962,7 +76963,7 @@ const pie = (originData, op) => {
         return data;
     }
     if (!showAllZero && showEmptyCircle && isDataEmpty(data, angleField, supportNegative)) {
-        return data;
+        return [];
     }
     const appendArcInfo = (data, startAngle, angle) => {
         data[asStartAngle] = startAngle;
@@ -77451,6 +77452,7 @@ class BasePieSeries extends PolarSeries {
             }, {
                 dataView: false
             });
+            this._emptyArcMark.setDepend(this._pieMark);
         }
     }
     startAngleScale(datum) {
@@ -77486,8 +77488,8 @@ class BasePieSeries extends PolarSeries {
         const emptyPieMark = this._emptyArcMark;
         if (emptyPieMark) {
             this.setMarkStyle(emptyPieMark, Object.assign(Object.assign({}, initialStyle), { visible: () => {
-                    const angleField = this.getAngleField()[0];
-                    return isDataEmpty(this.getViewData().latestData, angleField, this._supportNegative);
+                    const data = this.getViewData().latestData;
+                    return !data || !data.length;
                 } }), 'normal', AttributeLevel.Series);
         }
     }
@@ -89926,21 +89928,21 @@ function isValidStrokeOrFill(attr) {
     return isValid$1(attr) && attr !== 'none' && !((_a = attr.includes) === null || _a === void 0 ? void 0 : _a.call(attr, 'url'));
 }
 const getLineWidth = (attributes) => {
-    const strokeWidth = parseFloat(attributes['strokeWidth']);
+    const strokeWidth = parseFloat(attributes.strokeWidth);
     if (!isNaN(strokeWidth)) {
         return strokeWidth;
     }
-    const stroke = attributes['stroke'];
+    const stroke = attributes.stroke;
     return stroke && isValidStrokeOrFill(stroke) ? 1 : 0;
 };
 const getFill = (attributes, defaultFill) => {
     var _a;
-    const fill = (_a = attributes['fill']) !== null && _a !== void 0 ? _a : defaultFill;
+    const fill = (_a = attributes.fill) !== null && _a !== void 0 ? _a : defaultFill;
     return fill && isValidStrokeOrFill(fill) ? fill : undefined;
 };
 const getStroke = (attributes, defaultStroke) => {
     var _a;
-    const stroke = (_a = attributes['stroke']) !== null && _a !== void 0 ? _a : defaultStroke;
+    const stroke = (_a = attributes.stroke) !== null && _a !== void 0 ? _a : defaultStroke;
     return stroke && isValidStrokeOrFill(stroke) ? stroke : false;
 };
 const commonAttributes = (attributes) => {
@@ -89949,7 +89951,7 @@ const commonAttributes = (attributes) => {
 const graphicAttributeTransform = {
     group: (attributes) => {
         const common = commonAttributes(attributes);
-        return Object.assign(Object.assign({}, common), { visibleAll: common['visible'] !== false });
+        return Object.assign(Object.assign({}, common), { visibleAll: common.visible !== false });
     },
     rule: (attributes) => {
         return Object.assign(Object.assign({}, commonAttributes(attributes)), { x: parseFloat(attributes.x1), y: parseFloat(attributes.y1), x1: parseFloat(attributes.x2), y1: parseFloat(attributes.y2) });
@@ -90000,7 +90002,7 @@ const pictogram = (data) => {
             el._uniqueId = `${el.id}-${index}`;
             el.data = undefined;
             const { graphicType: type, transform } = el;
-            let finalAttributes = {
+            const finalAttributes = {
                 visible: el.attributes.visibility !== 'hidden' && el.attributes.visibility !== 'collapse'
             };
             if (el.graphicType === 'text') {
@@ -90035,7 +90037,7 @@ const pictogram = (data) => {
                 return result;
             });
             if (children && children.length) {
-                let startX = (_b = (_a = texts[i]._textGroupStyle) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 0;
+                const startX = (_b = (_a = texts[i]._textGroupStyle) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 0;
                 let curX = startX;
                 for (let j = 0; j < children.length; j++) {
                     const currentChild = children[j];
@@ -92011,49 +92013,40 @@ class SankeyChart extends BaseChart {
     }
     _setStateInDatum(stateKey, checkReverse, datum, filter, region) {
         const activeDatum = isArray$1(datum) ? datum[0] : datum;
-        const keys = !activeDatum ? null : Object.keys(activeDatum);
-        this.getRegionsInQuerier(region).forEach(r => {
-            if (!activeDatum) {
-                r.interaction.clearEventElement(stateKey, true);
-                return;
-            }
-            let hasPick = false;
-            r.getSeries().forEach(s => {
-                var _a, _b;
-                let activeNodeOrLink = null;
-                s.getMarksWithoutRoot().forEach(m => {
-                    if (m.type === 'text') {
-                        return;
-                    }
-                    let pickElement = null;
-                    const mark = m.getProduct();
-                    if (!mark) {
-                        return;
-                    }
-                    if (!filter || (isFunction$1(filter) && filter(s, m))) {
-                        pickElement = mark.elements.find((e) => keys.every(k => {
-                            var _a;
-                            let datum = (_a = e.getDatum()) === null || _a === void 0 ? void 0 : _a.datum;
-                            if (isArray$1(datum)) {
-                                datum = datum[0];
-                            }
-                            return activeDatum[k] == (datum === null || datum === void 0 ? void 0 : datum[k]);
-                        }));
-                    }
-                    if (pickElement) {
-                        hasPick = true;
-                        r.interaction.startInteraction(stateKey, pickElement);
-                        if (mark.id().includes('node') || mark.id().includes('link')) {
-                            activeNodeOrLink = pickElement;
-                        }
+        const markFilter = (series, mark) => {
+            return mark.type !== 'text' && mark.getProduct() && (!filter || filter(series, mark));
+        };
+        this.filterGraphicsByDatum(activeDatum, {
+            filter: markFilter,
+            region,
+            getDatum: e => {
+                var _a;
+                let d = (_a = e.getDatum()) === null || _a === void 0 ? void 0 : _a.datum;
+                if (isArray$1(d)) {
+                    d = d[0];
+                }
+                return d;
+            },
+            callback: (element, mark, s, r) => {
+                var _a, _b, _c;
+                const id = (_a = mark.getProduct()) === null || _a === void 0 ? void 0 : _a.id();
+                if (id && (id.includes('node') || id.includes('link'))) {
+                    (_c = (_b = s)._handleEmphasisElement) === null || _c === void 0 ? void 0 : _c.call(_b, { item: element });
+                }
+            },
+            regionCallback: (elements, r) => {
+                if (!activeDatum) {
+                    r.interaction.clearEventElement(stateKey, true);
+                    return;
+                }
+                else if (elements.length) {
+                    elements.forEach(e => {
+                        r.interaction.startInteraction(stateKey, e);
+                    });
+                    if (checkReverse) {
+                        r.interaction.reverseEventElement(stateKey);
                     }
-                });
-                if (activeNodeOrLink) {
-                    (_b = (_a = s)._handleEmphasisElement) === null || _b === void 0 ? void 0 : _b.call(_a, { item: activeNodeOrLink });
                 }
-            });
-            if (checkReverse && hasPick) {
-                r.interaction.reverseEventElement(stateKey);
             }
         });
     }
@@ -97508,17 +97501,22 @@ function computeOffsetFromRegion(point, offset, region) {
     }
     return offset;
 }
+function getProcessInfo(spec) {
+    return {
+        isXProcess: isValid$1(spec.x),
+        isYProcess: isValid$1(spec.y),
+        isX1Process: isValid$1(spec.x1),
+        isY1Process: isValid$1(spec.y1),
+        isAngleProcess: isValid$1(spec.angle),
+        isRadiusProcess: isValid$1(spec.radius),
+        isAngle1Process: isValid$1(spec.angle1),
+        isRadius1Process: isValid$1(spec.radius1),
+        isCoordinatesProcess: isValid$1(spec.coordinates),
+        isValidProcess: isValid$1(spec.process)
+    };
+}
 function getMarkLineProcessInfo(spec) {
-    const isXProcess = 'x' in spec;
-    const isYProcess = 'y' in spec;
-    const isX1Process = 'x1' in spec;
-    const isY1Process = 'y1' in spec;
-    const isAngleProcess = 'angle' in spec;
-    const isRadiusProcess = 'radius' in spec;
-    const isAngle1Process = 'angle1' in spec;
-    const isRadius1Process = 'radius1' in spec;
-    const isCoordinatesProcess = 'coordinates' in spec;
-    const isValidProcess = 'process' in spec;
+    const { isXProcess, isYProcess, isX1Process, isY1Process, isAngleProcess, isRadiusProcess, isAngle1Process, isRadius1Process, isCoordinatesProcess, isValidProcess } = getProcessInfo(spec);
     return {
         doXProcess: isXProcess && !isYProcess && !isY1Process,
         doXYY1Process: isXProcess && isYProcess && isY1Process,
@@ -97534,15 +97532,7 @@ function getMarkLineProcessInfo(spec) {
     };
 }
 function getMarkAreaProcessInfo(spec) {
-    const isXProcess = 'x' in spec;
-    const isX1Process = 'x1' in spec;
-    const isYProcess = 'y' in spec;
-    const isY1Process = 'y1' in spec;
-    const isAngleProcess = 'angle' in spec;
-    const isRadiusProcess = 'radius' in spec;
-    const isAngle1Process = 'angle1' in spec;
-    const isRadius1Process = 'radius1' in spec;
-    const isCoordinatesProcess = 'coordinates' in spec;
+    const { isXProcess, isYProcess, isX1Process, isY1Process, isAngleProcess, isRadiusProcess, isAngle1Process, isRadius1Process, isCoordinatesProcess } = getProcessInfo(spec);
     return {
         doXProcess: isXProcess && isX1Process && !isYProcess && !isY1Process,
         doYProcess: isYProcess && isY1Process && !isXProcess && !isX1Process,
@@ -98376,15 +98366,15 @@ class CartesianMarkLine extends BaseMarkLine {
                 type: 'markerAggregation',
                 options
             });
-            if (spec.process && 'x' in spec.process) {
+            if (spec.process && isValid$1(spec.process.x)) {
                 options = [this._processSpecByDims([{ dim: 'x', specValue: spec.process.x }])];
                 needAggr = true;
             }
-            if (spec.process && 'y' in spec.process) {
+            if (spec.process && isValid$1(spec.process.y)) {
                 options = options = [this._processSpecByDims([{ dim: 'y', specValue: spec.process.y }])];
                 needAggr = true;
             }
-            if (spec.process && 'xy' in spec.process) {
+            if (spec.process && isValid$1(spec.process.xy)) {
                 const { xField, yField } = relativeSeries.getSpec();
                 options = {
                     fieldX: xField,
@@ -99964,9 +99954,9 @@ class CartesianMarkPoint extends BaseMarkPoint {
         const spec = this._spec;
         const data = this._markerData;
         const relativeSeries = this._relativeSeries;
-        const isXYLayout = 'x' in spec && 'y' in spec;
-        const isCoordinateLayout = 'coordinate' in spec;
-        const isPositionLayout = 'position' in spec;
+        const isXYLayout = isValid$1(spec.x) && isValid$1(spec.y);
+        const isCoordinateLayout = isValid$1(spec.coordinate);
+        const isPositionLayout = isValid$1(spec.position);
         const autoRange = (_a = spec === null || spec === void 0 ? void 0 : spec.autoRange) !== null && _a !== void 0 ? _a : false;
         let point;
         if (isXYLayout) {
@@ -103807,4 +103797,4 @@ const registerMediaQuery = () => {
     registerChartPlugin(MediaQuery);
 };
 
-export { Arc3dMark, ArcMark, AreaChart, AreaMark, AreaSeries, AxisSyncPlugin, Bar3dChart, Bar3dSeries, BarChart, BarSeries, BaseChart, BaseChartSpecTransformer, BaseMark, BaseSeries, BoxPlotChart, BoxPlotSeries, Brush, CanvasTooltipHandler, CartesianAxis, CartesianBandAxis, CartesianCrossHair, CartesianLinearAxis, CartesianLogAxis, CartesianMarkArea, CartesianMarkLine, CartesianMarkPoint, CartesianSeries, CartesianSymlogAxis, CartesianTimeAxis, CirclePackingChart, CirclePackingSeries, CircularProgressChart, CircularProgressSeries, CommonChart, CommonChartSpecTransformer, ComponentMark, ComposedEventMapper, ContinuousLegend, CorrelationChart, CorrelationSeries, CustomMark, DEFAULT_CHART_HEIGHT, DEFAULT_CHART_WIDTH, DEFAULT_DATA_INDEX, DEFAULT_DATA_KEY, DEFAULT_DATA_SERIES_FIELD, DEFAULT_MEASURE_CANVAS_ID, DEFAULT_SERIES_STYLE_NAME, DataZoom, DimensionClickEvent, DimensionEventEnum, DimensionHoverEvent, DiscreteLegend, DomTooltipHandler, DotSeries, Event$1 as Event, Factory$1 as Factory, FormatterPlugin, Funnel3dChart, Funnel3dSeries, FunnelChart, FunnelSeries, GaugeChart, GaugePointerSeries, GaugeSeries, GeoCoordinate, GeoMarkPoint, GridLayout, GroupMark, HeatmapChart, HeatmapSeries, Histogram3dChart, HistogramChart, ImageMark, Indicator, Label, Layout$1 as Layout, Layout3d, LineChart, LineMark, LineSeries, LinearProgressChart, LinearProgressSeries, LinkSeries, LiquidChart, LiquidSeries, MOSAIC_CAT_END_PERCENT, MOSAIC_CAT_START_PERCENT, MOSAIC_VALUE_END_PERCENT, MOSAIC_VALUE_START_PERCENT, MapChart, MapLabelComponent, MapSeries, MediaQuery, MosaicChart, MosaicSeries, PREFIX, PathMark, PictogramChart, PictogramSeries, Pie3dChart, Pie3dSeries, PieChart, PieSeries, Player, PolarAxis, PolarBandAxis, PolarCrossHair, PolarLinearAxis, PolarMarkArea, PolarMarkLine, PolarMarkPoint, PolarSeries, PolygonMark, ProgressLikeSeries, Pyramid3dMark, RadarChart, RadarSeries, RangeAreaChart, RangeAreaSeries, RangeColumn3dChart, RangeColumn3dSeries, RangeColumnChart, RangeColumnSeries, Rect3dMark, RectMark, RenderModeEnum, RippleMark, RoseChart, RoseLikeSeries, RoseSeries, RuleMark, SEGMENT_FIELD_END, SEGMENT_FIELD_START, STACK_FIELD_END, STACK_FIELD_END_OffsetSilhouette, STACK_FIELD_END_PERCENT, STACK_FIELD_KEY, STACK_FIELD_START, STACK_FIELD_START_OffsetSilhouette, STACK_FIELD_START_PERCENT, STACK_FIELD_TOTAL, STACK_FIELD_TOTAL_BOTTOM, STACK_FIELD_TOTAL_PERCENT, STACK_FIELD_TOTAL_TOP, SankeyChart, SankeySeries, ScatterChart, ScatterSeries, ScrollBar, SequenceChart, SeriesMarkNameEnum, SeriesTypeEnum, SeriesTypeForThemeEnum, SunburstChart, SunburstSeries, SymbolMark, TextMark, ThemeManager$1 as ThemeManager, Title, Tooltip, TooltipResult, TotalLabel, TreemapChart, TreemapSeries, VChart, VennChart, VennSeries, WaterfallChart, WaterfallSeries, WordCloud3dChart, WordCloud3dSeries, WordCloudChart, WordCloudSeries, alternatingWave, builtinThemes, centerToCorner, columnCenterToEdge, columnEdgeToCenter, columnLeftToRight, columnRightToLeft, computeActualDataScheme, cornerToCenter, createArc, createArea, createGroup, createLine, createRect, createRichText, createSymbol, createText, darkTheme$1 as darkTheme, dataScheme, VChart as default, defaultThemeName, diagonalCenterToEdge, diagonalTopLeftToBottomRight, functionTransform, getActualColor, getCartesianDimensionInfo, getColorSchemeBySeries, getDataScheme, getFieldAlias, getMergedTheme, getPolarDimensionInfo, getRegionStackGroup, getTheme, hasThemeMerged, isColorKey, isProgressiveDataColorScheme, isTokenKey, lightTheme, mergeFields, particleEffect, pulseWave, queryColorFromColorScheme, queryToken, randomOpacity, register3DPlugin, registerAllEnv, registerAllMarks, registerAnimate, registerArc3dMark, registerArcMark, registerAreaChart, registerAreaMark, registerAreaSeries, registerBar3dChart, registerBar3dSeries, registerBarChart, registerBarSeries, registerBoxplotChart, registerBoxplotSeries, registerBrowserEnv, registerBrush, registerCanvasTooltipHandler, registerCartesianBandAxis, registerCartesianCrossHair, registerCartesianLinearAxis, registerCartesianLogAxis, registerCartesianSymlogAxis, registerCartesianTimeAxis, registerChartPlugin, registerCirclePackingChart, registerCirclePackingSeries, registerCircularProgressChart, registerCircularProgressSeries, registerCommonChart, registerComponentMark, registerContinuousLegend, registerCorrelationChart, registerCustomMark, registerDataZoom, registerDiscreteLegend, registerDomTooltipHandler, registerDotSeries, registerDragPlugin, registerFormatPlugin, registerFunnel3dChart, registerFunnel3dSeries, registerFunnelChart, registerFunnelSeries, registerGaugeChart, registerGaugePointerSeries, registerGaugeSeries, registerGeoCoordinate, registerGeoMarkPoint, registerGesturePlugin, registerGridLayout, registerGroupMark, registerHarmonyEnv, registerHeatmapChart, registerHeatmapSeries, registerHistogram3dChart, registerHistogramChart, registerHtmlAttributePlugin, registerImageMark, registerIndicator, registerLabel, registerLarkEnv, registerLayout3d, registerLineChart, registerLineMark, registerLineSeries, registerLinearProgressChart, registerLinearProgressSeries, registerLinkSeries, registerLiquidChart, registerLiquidSeries, registerLynxEnv, registerMapChart, registerMapLabel, registerMapSeries, registerMarkArea, registerMarkLine, registerMarkPoint, registerMediaQuery, registerMorph, registerMosaicChart, registerMosaicSeries, registerNodeEnv, registerPathMark, registerPictogramChart, registerPictogramSeries, registerPie3dChart, registerPie3dSeries, registerPieChart, registerPieSeries, registerPlayer, registerPolarBandAxis, registerPolarCrossHair, registerPolarLinearAxis, registerPolarMarkArea, registerPolarMarkLine, registerPolarMarkPoint, registerPolygonMark, registerPoptip, registerPyramid3dMark, registerRadarChart, registerRadarSeries, registerRangeAreaChart, registerRangeAreaSeries, registerRangeColumn3dChart, registerRangeColumn3dSeries, registerRangeColumnChart, registerRangeColumnSeries, registerReactAttributePlugin, registerRect3dMark, registerRectMark, registerRippleMark, registerRoseChart, registerRoseSeries, registerRuleMark, registerSankeyChart, registerSankeySeries, registerScatterChart, registerScatterSeries, registerScrollBar, registerSequenceChart, registerSunBurstSeries, registerSunburstChart, registerSymbolMark, registerTTEnv, registerTaroEnv, registerTextMark, registerTheme, registerTitle, registerTooltip, registerTotalLabel, registerTreemapChart, registerTreemapSeries, registerVennChart, registerVennSeries, registerWXEnv, registerWaterfallChart, registerWaterfallSeries, registerWordCloud3dChart, registerWordCloud3dSeries, registerWordCloudChart, registerWordCloudSeries, registerWordCloudShapeChart, removeTheme, rippleEffect, rotationScan, rowBottomToTop, rowCenterToEdge, rowEdgeToCenter, rowTopToBottom, snakeWave, sortStackValueGroup, specTransform, spiralEffect, stack, stackGroup, stackMosaic, stackMosaicTotal, stackOffsetSilhouette, stackTotal, themeExist, themes, token, transformColorSchemeToStandardStruct, version, vglobal };
+export { Arc3dMark, ArcMark, AreaChart, AreaMark, AreaSeries, AxisSyncPlugin, Bar3dChart, Bar3dSeries, BarChart, BarSeries, BaseChart, BaseChartSpecTransformer, BaseMark, BaseSeries, BoxPlotChart, BoxPlotSeries, Brush, CanvasTooltipHandler, CartesianAxis, CartesianBandAxis, CartesianChartSpecTransformer, CartesianCrossHair, CartesianLinearAxis, CartesianLogAxis, CartesianMarkArea, CartesianMarkLine, CartesianMarkPoint, CartesianSeries, CartesianSymlogAxis, CartesianTimeAxis, CirclePackingChart, CirclePackingSeries, CircularProgressChart, CircularProgressSeries, CommonChart, CommonChartSpecTransformer, ComponentMark, ComposedEventMapper, ContinuousLegend, CorrelationChart, CorrelationSeries, CustomMark, DEFAULT_CHART_HEIGHT, DEFAULT_CHART_WIDTH, DEFAULT_DATA_INDEX, DEFAULT_DATA_KEY, DEFAULT_DATA_SERIES_FIELD, DEFAULT_MEASURE_CANVAS_ID, DEFAULT_SERIES_STYLE_NAME, DataZoom, DimensionClickEvent, DimensionEventEnum, DimensionHoverEvent, DiscreteLegend, DomTooltipHandler, DotSeries, Event$1 as Event, Factory$1 as Factory, FormatterPlugin, Funnel3dChart, Funnel3dSeries, FunnelChart, FunnelSeries, GaugeChart, GaugePointerSeries, GaugeSeries, GeoCoordinate, GeoMarkPoint, GridLayout, GroupMark, HeatmapChart, HeatmapSeries, Histogram3dChart, HistogramChart, ImageMark, Indicator, Label, Layout$1 as Layout, Layout3d, LineChart, LineMark, LineSeries, LinearProgressChart, LinearProgressSeries, LinkSeries, LiquidChart, LiquidSeries, MOSAIC_CAT_END_PERCENT, MOSAIC_CAT_START_PERCENT, MOSAIC_VALUE_END_PERCENT, MOSAIC_VALUE_START_PERCENT, MapChart, MapLabelComponent, MapSeries, MediaQuery, MosaicChart, MosaicSeries, PREFIX, PathMark, PictogramChart, PictogramSeries, Pie3dChart, Pie3dSeries, PieChart, PieSeries, Player, PolarAxis, PolarBandAxis, PolarCrossHair, PolarLinearAxis, PolarMarkArea, PolarMarkLine, PolarMarkPoint, PolarSeries, PolygonMark, ProgressLikeSeries, Pyramid3dMark, RadarChart, RadarSeries, RangeAreaChart, RangeAreaSeries, RangeColumn3dChart, RangeColumn3dSeries, RangeColumnChart, RangeColumnSeries, Rect3dMark, RectMark, RenderModeEnum, RippleMark, RoseChart, RoseLikeSeries, RoseSeries, RuleMark, SEGMENT_FIELD_END, SEGMENT_FIELD_START, STACK_FIELD_END, STACK_FIELD_END_OffsetSilhouette, STACK_FIELD_END_PERCENT, STACK_FIELD_KEY, STACK_FIELD_START, STACK_FIELD_START_OffsetSilhouette, STACK_FIELD_START_PERCENT, STACK_FIELD_TOTAL, STACK_FIELD_TOTAL_BOTTOM, STACK_FIELD_TOTAL_PERCENT, STACK_FIELD_TOTAL_TOP, SankeyChart, SankeySeries, ScatterChart, ScatterSeries, ScrollBar, SequenceChart, SeriesMarkNameEnum, SeriesTypeEnum, SeriesTypeForThemeEnum, SunburstChart, SunburstSeries, SymbolMark, TextMark, ThemeManager$1 as ThemeManager, Title, Tooltip, TooltipResult, TotalLabel, TreemapChart, TreemapSeries, VChart, VennChart, VennSeries, WaterfallChart, WaterfallSeries, WordCloud3dChart, WordCloud3dSeries, WordCloudChart, WordCloudSeries, alternatingWave, builtinThemes, centerToCorner, columnCenterToEdge, columnEdgeToCenter, columnLeftToRight, columnRightToLeft, computeActualDataScheme, cornerToCenter, createArc, createArea, createGroup, createLine, createRect, createRichText, createSymbol, createText, darkTheme$1 as darkTheme, dataScheme, VChart as default, defaultThemeName, diagonalCenterToEdge, diagonalTopLeftToBottomRight, functionTransform, getActualColor, getCartesianDimensionInfo, getColorSchemeBySeries, getDataScheme, getFieldAlias, getMergedTheme, getPolarDimensionInfo, getRegionStackGroup, getTheme, hasThemeMerged, isColorKey, isProgressiveDataColorScheme, isTokenKey, lightTheme, mergeFields, particleEffect, pulseWave, queryColorFromColorScheme, queryToken, randomOpacity, register3DPlugin, registerAllEnv, registerAllMarks, registerAnimate, registerArc3dMark, registerArcMark, registerAreaChart, registerAreaMark, registerAreaSeries, registerBar3dChart, registerBar3dSeries, registerBarChart, registerBarSeries, registerBoxplotChart, registerBoxplotSeries, registerBrowserEnv, registerBrush, registerCanvasTooltipHandler, registerCartesianBandAxis, registerCartesianCrossHair, registerCartesianLinearAxis, registerCartesianLogAxis, registerCartesianSymlogAxis, registerCartesianTimeAxis, registerChartPlugin, registerCirclePackingChart, registerCirclePackingSeries, registerCircularProgressChart, registerCircularProgressSeries, registerCommonChart, registerComponentMark, registerContinuousLegend, registerCorrelationChart, registerCustomMark, registerDataZoom, registerDiscreteLegend, registerDomTooltipHandler, registerDotSeries, registerDragPlugin, registerFormatPlugin, registerFunnel3dChart, registerFunnel3dSeries, registerFunnelChart, registerFunnelSeries, registerGaugeChart, registerGaugePointerSeries, registerGaugeSeries, registerGeoCoordinate, registerGeoMarkPoint, registerGesturePlugin, registerGridLayout, registerGroupMark, registerHarmonyEnv, registerHeatmapChart, registerHeatmapSeries, registerHistogram3dChart, registerHistogramChart, registerHtmlAttributePlugin, registerImageMark, registerIndicator, registerLabel, registerLarkEnv, registerLayout3d, registerLineChart, registerLineMark, registerLineSeries, registerLinearProgressChart, registerLinearProgressSeries, registerLinkSeries, registerLiquidChart, registerLiquidSeries, registerLynxEnv, registerMapChart, registerMapLabel, registerMapSeries, registerMarkArea, registerMarkLine, registerMarkPoint, registerMediaQuery, registerMorph, registerMosaicChart, registerMosaicSeries, registerNodeEnv, registerPathMark, registerPictogramChart, registerPictogramSeries, registerPie3dChart, registerPie3dSeries, registerPieChart, registerPieSeries, registerPlayer, registerPolarBandAxis, registerPolarCrossHair, registerPolarLinearAxis, registerPolarMarkArea, registerPolarMarkLine, registerPolarMarkPoint, registerPolygonMark, registerPoptip, registerPyramid3dMark, registerRadarChart, registerRadarSeries, registerRangeAreaChart, registerRangeAreaSeries, registerRangeColumn3dChart, registerRangeColumn3dSeries, registerRangeColumnChart, registerRangeColumnSeries, registerReactAttributePlugin, registerRect3dMark, registerRectMark, registerRippleMark, registerRoseChart, registerRoseSeries, registerRuleMark, registerSankeyChart, registerSankeySeries, registerScatterChart, registerScatterSeries, registerScrollBar, registerSequenceChart, registerSunBurstSeries, registerSunburstChart, registerSymbolMark, registerTTEnv, registerTaroEnv, registerTextMark, registerTheme, registerTitle, registerTooltip, registerTotalLabel, registerTreemapChart, registerTreemapSeries, registerVennChart, registerVennSeries, registerWXEnv, registerWaterfallChart, registerWaterfallSeries, registerWordCloud3dChart, registerWordCloud3dSeries, registerWordCloudChart, registerWordCloudSeries, registerWordCloudShapeChart, removeTheme, rippleEffect, rotationScan, rowBottomToTop, rowCenterToEdge, rowEdgeToCenter, rowTopToBottom, snakeWave, sortStackValueGroup, specTransform, spiralEffect, stack, stackGroup, stackMosaic, stackMosaicTotal, stackOffsetSilhouette, stackTotal, themeExist, themes, token, transformColorSchemeToStandardStruct, version, vglobal };