@visactor/vchart 1.13.9-alpha.4 → 1.13.9-alpha.6

package/build/index.js

@@ -31431,10 +31431,6 @@
     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
@@ -31467,7 +31463,6 @@
           }
           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;
@@ -31482,14 +31477,11 @@
           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, {
+          }), "browser" === vglobal.env ? (vglobal.addEventListener("pointermove", this._onSliderPointerMoveWithDelay, {
             capture: !0
-          }), triggers.forEach(trigger => {
-            obj.addEventListener(trigger, this._onSliderPointerUp);
-          });
+          }), 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
@@ -31526,7 +31518,11 @@
           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) {
@@ -31675,15 +31671,6 @@
           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
-        }), triggers.forEach(trigger => {
-          obj.removeEventListener(trigger, this._onSliderPointerUp);
-        });
-      }
       _reset() {
         this._sliderRenderBounds = null, this._sliderLimitRange = null;
       }
@@ -39033,13 +39020,10 @@
           start: 0,
           end: 1
         }, this._statePointToData = state => state, this._onHandlerPointerDown = (e, tag) => {
-          this._clearDragEvents(), 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);
-          const evtTarget = "browser" === vglobal.env ? vglobal : this.stage,
-            triggers = getEndTriggersOfDrag();
-          evtTarget.addEventListener("pointermove", this._onHandlerPointerMove, {
+          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
-          }), triggers.forEach(trigger => {
-            evtTarget.addEventListener(trigger, this._onHandlerPointerUp);
           });
         }, this._pointerMove = e => {
           e.stopPropagation();
@@ -39080,7 +39064,11 @@
             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,
@@ -39099,7 +39087,7 @@
         } = 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));
+        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,15 +39118,6 @@
           y: 0
         };
       }
-      _clearDragEvents() {
-        const evtTarget = "browser" === vglobal.env ? vglobal : this.stage,
-          triggers = getEndTriggersOfDrag();
-        evtTarget.removeEventListener("pointermove", this._onHandlerPointerMove, {
-          capture: !0
-        }), triggers.forEach(trigger => {
-          evtTarget.removeEventListener(trigger, this._onHandlerPointerUp);
-        });
-      }
       _onHandlerPointerEnter(e) {
         e.stopPropagation(), this._showText = !0, this.renderText();
       }
@@ -42623,19 +42602,16 @@
           } = 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 => {
-          e.stopPropagation(), 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, {
+          this._currentHandler = e.target, this._prePos = this._isHorizontal ? x : y, "browser" === vglobal.env ? (vglobal.addEventListener("pointermove", this._onHandlerPointerMove, {
             capture: !0
-          }), triggers.forEach(trigger => {
-            obj.addEventListener(trigger, this._onHandlerPointerUp);
-          });
+          }), 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.stopPropagation(), this._isChanging = !0;
@@ -42659,21 +42635,22 @@
             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 => {
-          e.preventDefault(), this._isChanging = !1, this._currentHandler = null, this._clearAllDragEvents();
+          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 => {
-          e.stopPropagation(), 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, {
+          this._prePos = this._isHorizontal ? x : y, "browser" === vglobal.env ? (vglobal.addEventListener("pointermove", this._onTrackPointerMove, {
             capture: !0
-          }), triggers.forEach(trigger => {
-            obj.addEventListener(trigger, this._onTrackPointerUp);
-          });
+          }), 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.stopPropagation(), this._isChanging = !0;
           const {
@@ -42716,9 +42693,13 @@
           }
           this._prePos = currentPos, this._dispatchChangeEvent();
         }, this._onTrackPointerUp = e => {
-          e.preventDefault(), 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 => {
-          e.stopPropagation(), this._clearAllDragEvents(), this._isChanging = !0;
+          e.stopPropagation(), this._isChanging = !0;
           const {
             railWidth: railWidth,
             railHeight: railHeight,
@@ -43044,19 +43025,6 @@
       _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
-        }), triggers.forEach(trigger => {
-          obj.removeEventListener(trigger, this._onHandlerPointerUp);
-        }), obj.removeEventListener("pointermove", this._onTrackPointerMove, {
-          capture: !0
-        }), triggers.forEach(trigger => {
-          obj.removeEventListener(trigger, this._onTrackPointerUp);
-        });
-      }
       _updateTrack() {
         const {
             inverse: inverse,
@@ -63694,7 +63662,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     };
     registerVChartCore();
 
-    const version = "1.13.9-alpha.4";
+    const version = "1.13.9-alpha.6";
 
     const addVChartProperty = (data, op) => {
         const context = op.beforeCall();
@@ -71106,58 +71074,83 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 }
             });
         }
-        _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);
+                        }
+                    }
                 }
             });
         }
@@ -92016,49 +92009,40 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         _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);
                 }
             });
         }