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

package/build/index.js

@@ -23968,38 +23968,6 @@
     };
     DefaultPickService = __decorate$Z([injectable(), __param$u(0, inject(ContributionProvider)), __param$u(0, named(PickItemInterceptor)), __metadata$J("design:paramtypes", [Object])], DefaultPickService);
 
-    function simplifyRadialDist(points, sqTolerance) {
-      let deltaX,
-        deltaY,
-        lastX = points[0].x,
-        lastY = points[0].y;
-      const newPoints = [points[0]];
-      for (let i = 1, len = points.length; i < len; i++) deltaX = points[i].x - lastX, deltaY = points[i].y - lastY, deltaX * deltaX + deltaY * deltaY > sqTolerance && (lastX = points[i].x, lastY = points[i].y, newPoints.push(points[i]));
-      return points[points.length - 1].x === lastX && points[points.length - 1].y === lastY || newPoints.push(points[points.length - 1]), newPoints;
-    }
-    function simplifyDPStep(points, startIdx, endIdx, sqTolerance, simplified) {
-      let maxSqDist = sqTolerance,
-        nextIdx = startIdx;
-      const startX = points[startIdx].x,
-        startY = points[startIdx].y,
-        vecX2 = points[endIdx].x - startX,
-        vecY2 = points[endIdx].y - startY,
-        sqLength = vecX2 * vecX2 + vecY2 * vecY2;
-      let area, sqArea, sqDistance, vecX1, vecY1;
-      for (let i = startIdx + 1, len = endIdx - 1; i < len; i++) vecX1 = points[i].x - startX, vecY1 = points[i].y - startY, area = vecX1 * vecY2 - vecX2 * vecY1, sqArea = area * area, sqDistance = sqArea / sqLength, sqDistance > maxSqDist && (maxSqDist = sqDistance, nextIdx = i);
-      maxSqDist > sqTolerance && (nextIdx - startIdx > 2 && simplifyDPStep(points, startIdx, nextIdx, sqTolerance, simplified), simplified.push(points[nextIdx], points[nextIdx + 1]), endIdx - nextIdx > 2 && simplifyDPStep(points, nextIdx, endIdx, sqTolerance, simplified));
-    }
-    function simplifyDouglasPeucker(points, sqTolerance) {
-      const lastIdx = points.length - 1,
-        simplified = [points[0]];
-      return simplifyDPStep(points, 0, lastIdx, sqTolerance, simplified), simplified.push(points[lastIdx]), simplified;
-    }
-    function flatten_simplify(points, tolerance, highestQuality) {
-      if (points.length <= 10) return points;
-      const sqTolerance = void 0 !== tolerance ? tolerance * tolerance : 1;
-      return points = simplifyDouglasPeucker(points = highestQuality ? points : simplifyRadialDist(points, sqTolerance), sqTolerance);
-    }
-
     let loadArcModule = !1;
     const arcModule = new ContainerModule(bind => {
       loadArcModule || (loadArcModule = !0, bind(DefaultCanvasArcRender).toSelf().inSingletonScope(), bind(ArcRender).to(DefaultCanvasArcRender).inSingletonScope(), bind(GraphicRender).toService(ArcRender), bind(ArcRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bindContributionProvider(bind, ArcRenderContribution));
@@ -36988,17 +36956,9 @@
         }), items.length > 1 && alternateColor) {
           const colors = isArray$3(alternateColor) ? alternateColor : [alternateColor, "transparent"],
             getColor = index => colors[index % colors.length];
-          for (let index = 0; index < items.length; index++) {
-            const prev = items[index].points;
-            let curr;
-            curr = index !== items.length - 1 ? items[index + 1].points : [{
-              x: items[index].points[0].x + (items[index].points[0].x - items[index - 1].points[0].x),
-              y: items[index].points[0].y + (items[index].points[0].y - items[index - 1].points[0].y)
-            }, {
-              x: items[index].points[1].x + (items[index].points[1].x - items[index - 1].points[1].x),
-              y: items[index].points[1].y + (items[index].points[1].y - items[index - 1].points[1].y)
-            }];
-            const path = getRegionPath(prev, curr, gridAttrs),
+          for (let index = 0; index < items.length - 1; index++) {
+            const [prev, curr] = [items[index].points, items[index + 1].points],
+              path = getRegionPath(prev, curr, gridAttrs),
               shape = graphicCreator.path({
                 path: path,
                 fill: getColor(index)
@@ -37445,11 +37405,11 @@
             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), 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", {
+          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), !realTime || startAttr === start && endAttr === end || (this.setStateAttr(start, end, !0), 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 {
@@ -37462,11 +37422,11 @@
             const pos = this.eventPosToStagePos(e);
             this.backgroundDragZoom(this._activeCache.startPos, pos);
           }
-          this._activeState = !1, brushSelect && this.renderDragMask(), start === this.state.start && end === this.state.end || this.setStateAttr(this.state.start, this.state.end, !0), this._dispatchEvent("change", {
+          this._activeState = !1, brushSelect && this.renderDragMask(), realTime && start === this.state.start && end === this.state.end || (this.setStateAttr(this.state.start, this.state.end, !0), this._dispatchEvent("change", {
             start: this.state.start,
             end: this.state.end,
             tag: this._activeTag
-          }), "browser" === vglobal.env && (vglobal.removeEventListener("pointermove", this._onHandlerPointerMove, {
+          })), "browser" === vglobal.env && (vglobal.removeEventListener("pointermove", this._onHandlerPointerMove, {
             capture: !0
           }), vglobal.removeEventListener("pointerup", this._onHandlerPointerUp)), this.removeEventListener("pointermove", this._onHandlerPointerMove, {
             capture: !0
@@ -37514,14 +37474,14 @@
         }));
       }
       eventPosToStagePos(e) {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b;
         const {
           x: x,
           y: y
-        } = vglobal.mapToCanvasPoint(e, null === (_d = null === (_c = null === (_b = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.window) || void 0 === _b ? void 0 : _b.getContext()) || void 0 === _c ? void 0 : _c.canvas) || void 0 === _d ? void 0 : _d.nativeCanvas);
+        } = vglobal.mapToCanvasPoint(e, this.stage.window.getContext().canvas.nativeCanvas);
         return {
-          x: x - ((null === (_e = this.stage) || void 0 === _e ? void 0 : _e.x) || 0),
-          y: y - ((null === (_f = this.stage) || void 0 === _f ? void 0 : _f.y) || 0)
+          x: x - ((null === (_a = this.stage) || void 0 === _a ? void 0 : _a.x) || 0),
+          y: y - ((null === (_b = this.stage) || void 0 === _b ? void 0 : _b.y) || 0)
         };
       }
       _onHandlerPointerEnter(e) {
@@ -37674,7 +37634,7 @@
         } else this._isHorizontal ? this._startText.setAttribute("dy", startTextDy) : this._startText.setAttribute("dx", startTextDx);
       }
       getLayoutAttrFromConfig() {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d;
         if (this._layoutAttrFromConfig) return this._layoutAttrFromConfig;
         const {
             position: positionConfig,
@@ -37682,8 +37642,7 @@
             orient: orient,
             middleHandlerStyle = {},
             startHandlerStyle = {},
-            endHandlerStyle = {},
-            backgroundStyle = {}
+            endHandlerStyle = {}
           } = this.attribute,
           {
             width: widthConfig,
@@ -37705,8 +37664,8 @@
           y: position.y
         }) : (height -= (startHandlerSize + endHandlerSize) / 2, position = {
           x: position.x,
-          y: position.y + startHandlerSize / 2
-        })), height += null !== (_e = backgroundStyle.lineWidth / 2) && void 0 !== _e ? _e : 1, width += null !== (_f = backgroundStyle.lineWidth / 2) && void 0 !== _f ? _f : 1, this._layoutAttrFromConfig = {
+          y: position.y + startHandlerSize
+        })), this._layoutAttrFromConfig = {
           position: position,
           width: width,
           height: height
@@ -37919,21 +37878,12 @@
           basePointEnd: basePointEnd
         };
       }
-      simplifyPoints(points) {
-        var _a;
-        if (points.length > 1e4) {
-          const tolerance = null !== (_a = this.attribute.tolerance) && void 0 !== _a ? _a : this._previewData.length / 1e4;
-          return flatten_simplify(points, tolerance, !1);
-        }
-        return points;
-      }
       getPreviewLinePoints() {
-        let previewPoints = this._previewData.map(d => ({
+        const previewPoints = this._previewData.map(d => ({
           x: this._previewPointsX && this._previewPointsX(d),
           y: this._previewPointsY && this._previewPointsY(d)
         }));
         if (0 === previewPoints.length) return previewPoints;
-        previewPoints = this.simplifyPoints(previewPoints);
         const {
           basePointStart: basePointStart,
           basePointEnd: basePointEnd
@@ -37941,14 +37891,13 @@
         return basePointStart.concat(previewPoints).concat(basePointEnd);
       }
       getPreviewAreaPoints() {
-        let previewPoints = this._previewData.map(d => ({
+        const previewPoints = this._previewData.map(d => ({
           x: this._previewPointsX && this._previewPointsX(d),
           y: this._previewPointsY && this._previewPointsY(d),
           x1: this._previewPointsX1 && this._previewPointsX1(d),
           y1: this._previewPointsY1 && this._previewPointsY1(d)
         }));
         if (0 === previewPoints.length) return previewPoints;
-        previewPoints = this.simplifyPoints(previewPoints);
         const {
           basePointStart: basePointStart,
           basePointEnd: basePointEnd
@@ -44297,9 +44246,12 @@
           excludedChannels = Object.keys(excludedChannelMap).filter(channel => 0 !== excludedChannelMap[channel]);
         this.subAnimate.animate.preventAttrs(excludedChannels);
         const from = Object.assign({}, this.from),
-          to = Object.assign({}, this.to);
+          to = Object.assign({}, this.to),
+          animatedChannels = [];
         Object.keys(to).forEach(k => {
-          excludedChannels.includes(k) ? (from[k] = to[k], this.from[k] = to[k]) : isNil$3(from[k]) && (from[k] = this.target.getComputedAttribute(k));
+          excludedChannels.includes(k) ? (from[k] = to[k], this.from[k] = to[k]) : isNil$3(from[k]) ? from[k] = this.target.getComputedAttribute(k) : animatedChannels.push(k);
+        }), this.target.animates.forEach(a => {
+          a !== this.subAnimate.animate && a.preventAttrs(animatedChannels);
         }), this.target.setAttributes(from, !1, {
           type: AttributeUpdateType.ANIMATE_UPDATE,
           animationState: {
@@ -54985,6 +54937,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         if (isFunctionStyle) {
             return true;
         }
+        const hasPostProcess = isFunction$1(style.postProcess);
+        if (hasPostProcess) {
+            return true;
+        }
         const isScale = !!(style === null || style === void 0 ? void 0 : style.scale);
         if (isScale) {
             if (style.field !== facetField) {
@@ -57937,6 +57893,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             if (stateStyle.referer) {
                 return stateStyle.referer._computeAttribute(key, state);
             }
+            if (!stateStyle.style) {
+                return (datum, opt) => stateStyle.style;
+            }
             if (typeof stateStyle.style === 'function') {
                 return (datum, opt) => stateStyle.style(datum, this._attributeContext, opt, this.getDataView());
             }
@@ -59956,7 +59915,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         registerChartPlugin(MediaQuery);
     };
 
-    const version = "1.9.6-alpha.4";
+    const version = "1.9.6-alpha.6";
 
     const addVChartProperty = (data, op) => {
         const context = op.beforeCall();
@@ -66361,19 +66320,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         if (newDomain.length === 0) {
             return [];
         }
-        const domainMap = {};
-        newDomain.forEach(d => {
-            if (!domainMap[d]) {
-                domainMap[d] = 1;
-            }
-        });
         let filter = null;
         if (isContinuous()) {
             filter = (d) => d[datumField] >= newDomain[0] && d[datumField] <= newDomain[1];
         }
         else {
             filter = (d) => {
-                return domainMap[d[datumField] + ''] || domainMap[d[datumField]];
+                return newDomain.indexOf(d[datumField] + '') >= 0 || newDomain.indexOf(d[datumField]) >= 0;
             };
         }
         return data.filter(filter);
@@ -66751,7 +66704,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }, this._getRegionOrSeriesLayout(regionOrSeries), false)) {
                 return;
             }
-            this._clickEnable = false;
             if (callback) {
                 callback({ zoomDelta, zoomX, zoomY }, event);
             }
@@ -66835,7 +66787,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }, this._getRegionOrSeriesLayout(regionOrSeries), false)) {
                 return stopBubble;
             }
-            this._clickEnable = false;
             if (callback) {
                 stopBubble = callback({ scrollX, scrollY }, event);
             }
@@ -66945,7 +66896,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             if (this._option.disableTriggerEvent) {
                 return;
             }
-            this._clickEnable = true;
+            this._clickEnable = false;
             if (!this._zoomableTrigger.parserDragEvent(params.event)) {
                 return;
             }
@@ -66960,7 +66911,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             let upX = event.canvasX;
             let upY = event.canvasY;
             const mouseup = delayMap[delayType]((params) => {
-                this._clickEnable = false;
+                this._clickEnable = true;
                 const event = params.event;
                 const dx = event.canvasX - upX;
                 const dy = event.canvasY - upY;
@@ -75033,6 +74984,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         _buildMarkAttributeContext() {
             super._buildMarkAttributeContext();
             this._markAttributeContext.valueToPosition = this.valueToPosition.bind(this);
+            this._markAttributeContext.getPoints = this.getPoints.bind(this);
+            this._markAttributeContext.isTransformLevel = this.isTransformLevel.bind(this);
         }
         valueToPosition(category) {
             var _a, _b, _c;
@@ -82408,7 +82361,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 : null;
         }
         _delegateAxisContainerEvent(component) {
-            component.addEventListener('*', ((event, type) => this._delegateEvent(component, event, type)));
+            if (component.listenerCount('*') === 0) {
+                component.addEventListener('*', ((event, type) => this._delegateEvent(component, event, type)));
+            }
         }
         _getAxisAttributes() {
             const spec = this._spec;
@@ -87659,27 +87614,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         get orient() {
             return this._orient;
         }
-        get isHorizontal() {
-            return this._isHorizontal;
-        }
-        get stateScale() {
-            return this._stateScale;
-        }
-        get relatedAxisComponent() {
-            return this._relatedAxisComponent;
-        }
-        get state() {
-            return {
-                start: this._start,
-                end: this._end,
-                startValue: this._startValue,
-                endValue: this._endValue
-            };
-        }
         setStartAndEnd(start, end, rangeMode = ['percent', 'percent']) {
             const [startMode = 'percent', endMode = 'percent'] = rangeMode;
-            const startPercent = (startMode === 'percent' ? start : this.dataToStatePoint(start));
-            const endPercent = (endMode === 'percent' ? end : this.dataToStatePoint(end));
+            const startPercent = (startMode === 'percent' ? start : this._dataToStatePoint(start));
+            const endPercent = (endMode === 'percent' ? end : this._dataToStatePoint(end));
             this._handleChange(startPercent, endPercent, true);
         }
         enableInteraction() {
@@ -87705,7 +87643,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         _handleChange(start, end, updateComponent) {
             var _a, _b;
             const zoomLock = (_b = (_a = this._spec) === null || _a === void 0 ? void 0 : _a.zoomLock) !== null && _b !== void 0 ? _b : false;
-            if (zoomLock) {
+            if (zoomLock || end - start < this._minSpan || end - start > this._maxSpan) {
                 this._shouldChange = false;
             }
         }
@@ -87979,9 +87917,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._handleChange(this._start, this._end, true);
         }
         _computeDomainOfStateScale(isContinuous) {
-            if (this._spec.customDomain) {
-                return this._spec.customDomain;
-            }
             const domain = this._data.getLatestData().map((d) => d[this._stateField]);
             if (isContinuous) {
                 const domainNum = domain.map((n) => n * 1);
@@ -88104,23 +88039,14 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         _statePointToData(state) {
             const scale = this._stateScale;
-            const domain = scale.domain();
-            if (isContinuous(scale.type)) {
-                if (this._isReverse()) {
-                    return domain[0] + (domain[1] - domain[0]) * (1 - state);
-                }
-                return domain[0] + (domain[1] - domain[0]) * state;
-            }
             let range = scale.range();
             if (this._isReverse()) {
                 range = range.slice().reverse();
             }
             const posInRange = range[0] + (range[1] - range[0]) * state;
-            const bandSize = scale.bandwidth();
-            const domainIndex = Math.min(Math.max(0, Math.floor(posInRange / bandSize)), domain.length - 1);
-            return domain[domainIndex];
+            return scale.invert(posInRange);
         }
-        dataToStatePoint(data) {
+        _dataToStatePoint(data) {
             const scale = this._stateScale;
             const pos = scale.scale(data);
             let range = scale.range();
@@ -88143,17 +88069,17 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             if (this._spec.rangeMode) {
                 const [startMode, endMode] = this._spec.rangeMode;
                 if (this._modeCheck('start', startMode) && this._modeCheck('end', endMode)) {
-                    start = startMode === 'percent' ? this._spec.start : this.dataToStatePoint(this._spec.startValue);
-                    end = endMode === 'percent' ? this._spec.end : this.dataToStatePoint(this._spec.endValue);
+                    start = startMode === 'percent' ? this._spec.start : this._dataToStatePoint(this._spec.startValue);
+                    end = endMode === 'percent' ? this._spec.end : this._dataToStatePoint(this._spec.endValue);
                 }
             }
             else {
                 start = this._spec.start
                     ? this._spec.start
                     : this._spec.startValue
-                        ? this.dataToStatePoint(this._spec.startValue)
+                        ? this._dataToStatePoint(this._spec.startValue)
                         : 0;
-                end = this._spec.end ? this._spec.end : this._spec.endValue ? this.dataToStatePoint(this._spec.endValue) : 1;
+                end = this._spec.end ? this._spec.end : this._spec.endValue ? this._dataToStatePoint(this._spec.endValue) : 1;
             }
             this._startValue = this._statePointToData(start);
             this._endValue = this._statePointToData(end);
@@ -88194,11 +88120,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                         .range(defaultRange);
                 }
                 else {
-                    this._stateScale.domain(domain, true).range(defaultRange).padding(0);
+                    this._stateScale.domain(domain, true).range(defaultRange);
                 }
             }
             else {
-                this._stateScale = new BandScale().padding(0);
+                this._stateScale = new BandScale();
                 this._stateScale.domain(this._computeDomainOfStateScale(), true).range(defaultRange);
             }
         }
@@ -88457,7 +88383,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this.layoutZIndex = exports.LayoutZIndex.DataZoom;
             this.layoutLevel = exports.LayoutLevel.DataZoom;
             this.layoutType = 'region-relative';
-            this._isReverseCache = false;
             this._dataToPositionX = (datum) => {
                 const offsetLeft = this._orient === 'left' ? this._middleHandlerSize : 0;
                 const offsetHandler = this._isHorizontal ? this._startHandlerSize / 2 : 0;
@@ -88525,10 +88450,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         onLayoutEnd(ctx) {
             this._updateScaleRange();
-            if (this._isReverse() && !this._isReverseCache) {
-                this._isReverseCache = this._isReverse();
-                this.effect.onZoomChange();
-            }
             if (this._cacheVisibility !== false) {
                 super.onLayoutEnd(ctx);
             }
@@ -88551,28 +88472,19 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             const defaultSize = this._isHorizontal
                 ? this.getLayoutRect().width - handlerSize
                 : this.getLayoutRect().height - handlerSize;
-            const defaultRange = (_b = (_a = this._relatedAxisComponent) === null || _a === void 0 ? void 0 : _a.getScale().range()) !== null && _b !== void 0 ? _b : [
-                this._startHandlerSize / 2,
-                defaultSize - this._endHandlerSize / 2
-            ];
+            const defaultRange = (_b = (_a = this._relatedAxisComponent) === null || _a === void 0 ? void 0 : _a.getScale().range()) !== null && _b !== void 0 ? _b : [0, defaultSize];
             if (this._isHorizontal) {
-                stateScaleRange = this._visible
-                    ? [this._startHandlerSize / 2, this._computeWidth() - this._endHandlerSize / 2]
-                    : defaultRange;
+                stateScaleRange = this._visible ? [0, this._computeWidth() - handlerSize] : defaultRange;
                 this._stateScale.range(stateScaleRange);
                 this._valueScale.range([this._computeHeight() - this._middleHandlerSize, 0]);
             }
             else if (this.layoutOrient === 'left') {
-                stateScaleRange = this._visible
-                    ? [this._startHandlerSize / 2, this._computeHeight() - this._endHandlerSize / 2]
-                    : defaultRange;
+                stateScaleRange = this._visible ? [0, this._computeHeight() - handlerSize] : defaultRange;
                 this._stateScale.range(stateScaleRange);
                 this._valueScale.range([this._computeWidth() - this._middleHandlerSize, 0]);
             }
             else {
-                stateScaleRange = this._visible
-                    ? [this._startHandlerSize / 2, this._computeHeight() - this._endHandlerSize / 2]
-                    : defaultRange;
+                stateScaleRange = this._visible ? [0, this._computeHeight() - handlerSize] : defaultRange;
                 this._stateScale.range(stateScaleRange);
                 this._valueScale.range([0, this._computeWidth() - this._middleHandlerSize]);
             }
@@ -88650,7 +88562,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 }, orient: this._orient, size: {
                     width: this.getLayoutRect().width,
                     height: this.getLayoutRect().height
-                }, showDetail: spec.showDetail, brushSelect: (_b = spec.brushSelect) !== null && _b !== void 0 ? _b : false, zoomLock: (_c = spec.zoomLock) !== null && _c !== void 0 ? _c : false, minSpan: this._minSpan, maxSpan: this._maxSpan, delayType: spec.delayType, delayTime: isValid$3(spec.delayType) ? (_d = spec.delayTime) !== null && _d !== void 0 ? _d : 30 : 0, realTime: (_e = spec.realTime) !== null && _e !== void 0 ? _e : true, previewData: isNeedPreview && this._data.getLatestData(), previewPointsX: isNeedPreview && this._dataToPositionX, previewPointsY: isNeedPreview && this._dataToPositionY, tolerance: this._spec.tolerance }, this._getComponentAttrs());
+                }, showDetail: spec.showDetail, brushSelect: (_b = spec.brushSelect) !== null && _b !== void 0 ? _b : false, zoomLock: (_c = spec.zoomLock) !== null && _c !== void 0 ? _c : false, minSpan: this._minSpan, maxSpan: this._maxSpan, delayType: spec.delayType, delayTime: isValid$3(spec.delayType) ? (_d = spec.delayTime) !== null && _d !== void 0 ? _d : 30 : 0, realTime: (_e = spec.realTime) !== null && _e !== void 0 ? _e : true, previewData: isNeedPreview && this._data.getLatestData(), previewPointsX: isNeedPreview && this._dataToPositionX, previewPointsY: isNeedPreview && this._dataToPositionY }, this._getComponentAttrs());
         }
         _createOrUpdateComponent() {
             if (this._visible) {
@@ -88688,11 +88600,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 }
                 this._start = start;
                 this._end = end;
-                const startValue = this._statePointToData(start);
-                const endValue = this._statePointToData(end);
-                const hasChange = isFunction$1(this._spec.updateDataAfterChange)
-                    ? this._spec.updateDataAfterChange(start, end, startValue, endValue)
-                    : this._handleStateChange(startValue, endValue, tag);
+                const hasChange = this._handleStateChange(this._statePointToData(start), this._statePointToData(end), tag);
                 if (hasChange) {
                     this.event.emit(exports.ChartEvent.dataZoomChange, {
                         model: this,
@@ -88881,11 +88789,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 }
                 this._start = start;
                 this._end = end;
-                const startValue = this._statePointToData(start);
-                const endValue = this._statePointToData(end);
-                const hasChange = isFunction$1(this._spec.updateDataAfterChange)
-                    ? this._spec.updateDataAfterChange(start, end, startValue, endValue)
-                    : this._handleStateChange(this._statePointToData(start), this._statePointToData(end));
+                const hasChange = this._handleStateChange(this._statePointToData(start), this._statePointToData(end));
                 if (hasChange) {
                     this.event.emit(exports.ChartEvent.scrollBarChange, {
                         model: this,
@@ -90966,6 +90870,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         _getNeedClearVRenderComponents() {
             return [];
         }
+        _delegateLabelEvent(component) {
+            if (component.listenerCount('*') === 0) {
+                component.addEventListener('*', ((event, type) => this._delegateEvent(component, event, type)));
+            }
+        }
     }
     BaseLabelComponent.type = ComponentTypeEnum.label;
 
@@ -91075,23 +90984,19 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 });
                 this.event.off(exports.VGRAMMAR_HOOK_EVENT.AFTER_MARK_RENDER_END, enableAnimation);
             };
-            this.event.on('afterElementEncode', eventParams => {
-                var _a;
-                const mark = eventParams.item;
-                if (this._option.getChart().getLayoutTag() === false && ((_a = mark.getContext()) === null || _a === void 0 ? void 0 : _a.model) === this) {
-                    this._delegateLabelEvent(mark.getGroupGraphicItem());
+        }
+        afterCompile() {
+            this._labelComponentMap.forEach((info, component) => {
+                const product = component.getProduct();
+                if (product) {
+                    product.addEventListener(exports.VGRAMMAR_HOOK_EVENT.AFTER_ELEMENT_ENCODE, () => {
+                        if (this._isLayout === false) {
+                            this._delegateLabelEvent(product.getGroupGraphicItem());
+                        }
+                    });
                 }
             });
         }
-        _delegateLabelEvent(component) {
-            const textNodes = component === null || component === void 0 ? void 0 : component.findAll(node => node.type === 'text', true).filter(text => !text.__vchart_event);
-            if (textNodes && textNodes.length > 0) {
-                textNodes.forEach(text => {
-                    text.__vchart_event = true;
-                    text.addEventListener('*', ((event, type) => this._delegateEvent(component, event, type, text, text.attribute.data)));
-                });
-            }
-        }
         _initTextMark() {
             if (!this._labelInfoMap) {
                 this._labelInfoMap = new Map();
@@ -91344,6 +91249,18 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 this._marks.addMark(component);
             }
         }
+        afterCompile() {
+            this._marks.forEach((componentMark, index) => {
+                const product = componentMark.getProduct();
+                if (product) {
+                    product.addEventListener(exports.VGRAMMAR_HOOK_EVENT.AFTER_ELEMENT_ENCODE, () => {
+                        if (this._isLayout === false) {
+                            this._delegateLabelEvent(product.getGroupGraphicItem());
+                        }
+                    });
+                }
+            });
+        }
         updateLayoutAttribute() {
             super.updateLayoutAttribute();
             const series = this._getSeries();
@@ -91602,7 +91519,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._needInitOutState = true;
             this._cacheInteractiveRangeAttrs = [];
             this._needDisablePickable = false;
-            this._relatedDataZooms = [];
         }
         init() {
             const inBrushMarkAttr = this._transformBrushedMarkAttr(this._spec.inBrush);
@@ -91635,14 +91551,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this.initEvent();
             this._bindRegions();
             this._bindLinkedSeries();
-            this._bindDataZoom();
             this._initNeedOperatedItem();
         }
         _extendDataInBrush(elementsMap) {
             const data = [];
             for (const brushName in elementsMap) {
                 for (const elementKey in elementsMap[brushName]) {
-                    data.push(Object.assign(Object.assign({}, elementsMap[brushName][elementKey].data[0]), { getSeries: elementsMap[brushName][elementKey].getSeries }));
+                    data.push(elementsMap[brushName][elementKey].data[0]);
                 }
             }
             return data;
@@ -91702,11 +91617,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 this._needInitOutState = false;
                 this._needDisablePickable = true;
                 this._handleBrushChange(exports.ChartEvent.brushChange, region, e);
-                this._emitEvent(exports.ChartEvent.brushChange, region);
             });
             brush.addEventListener(IOperateType.moving, (e) => {
                 this._handleBrushChange(exports.ChartEvent.brushChange, region, e);
-                this._emitEvent(exports.ChartEvent.brushChange, region);
             });
             brush.addEventListener(IOperateType.brushClear, (e) => {
                 this._initMarkBrushState(componentIndex, '');
@@ -91714,31 +91627,23 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 this._needDisablePickable = false;
                 this._handleBrushChange(exports.ChartEvent.brushChange, region, e);
                 this._handleBrushChange(exports.ChartEvent.brushClear, region, e);
-                this._emitEvent(exports.ChartEvent.brushChange, region);
-                this._emitEvent(exports.ChartEvent.brushClear, region);
             });
             brush.addEventListener(IOperateType.drawEnd, (e) => {
                 this._needInitOutState = true;
                 this._needDisablePickable = false;
-                const { operateMask } = e.detail;
                 this._handleBrushChange(exports.ChartEvent.brushEnd, region, e);
-                this._setDataZoomState(operateMask, region);
-                this._emitEvent(exports.ChartEvent.brushEnd, region);
             });
             brush.addEventListener(IOperateType.moveEnd, (e) => {
-                const { operateMask } = e.detail;
                 this._handleBrushChange(exports.ChartEvent.brushEnd, region, e);
-                this._setDataZoomState(operateMask, region);
-                this._emitEvent(exports.ChartEvent.brushEnd, region);
             });
         }
         _handleBrushChange(eventType, region, e) {
             const { operateMask } = e.detail;
             this._reconfigItem(operateMask, region);
             this._reconfigLinkedItem(operateMask, region);
+            this._emitEvent(eventType, region);
         }
         _emitEvent(eventType, region) {
-            var _a;
             this.event.emit(eventType, {
                 model: this,
                 value: {
@@ -91751,8 +91656,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     inBrushElementsMap: this._inBrushElementsMap,
                     outOfBrushElementsMap: this._outOfBrushElementsMap,
                     linkedInBrushElementsMap: this._linkedInBrushElementsMap,
-                    linkedOutOfBrushElementsMap: this._linkedOutOfBrushElementsMap,
-                    releatedDataZoom: (_a = this._relatedDataZooms) !== null && _a !== void 0 ? _a : []
+                    linkedOutOfBrushElementsMap: this._linkedOutOfBrushElementsMap
                 }
             });
         }
@@ -91781,7 +91685,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 const elements = grammarMark.elements;
                 elements.forEach((el) => {
                     var _a, _b, _c;
-                    el.getSeries = mark.getSeries;
                     const graphicItem = el.getGraphicItem();
                     const elementKey = mark.id + '_' + el.key;
                     if (((_a = this._outOfBrushElementsMap) === null || _a === void 0 ? void 0 : _a[elementKey]) && this._isBrushContainItem(operateMask, graphicItem)) {
@@ -91912,63 +91815,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
             return brushMask.globalAABBBounds.intersects(item.globalAABBBounds);
         }
-        _findValueInDataZoom(dataZoom, dataValue, type) {
-            const stateScale = dataZoom.stateScale;
-            if (isContinuous(stateScale.type)) {
-                return Math[type](...dataValue);
-            }
-            const domain = stateScale.domain();
-            const dataIndex = dataValue.map(d => d.indexOf(domain));
-            return domain[Math[type](...dataIndex)];
-        }
-        _setDataZoomComponent(dataZooms, region, operateMaskBounds, inBrushDataValue, isHorizontal) {
-            var _a;
-            const range = (_a = this._spec.dataZoomRangeExpand) !== null && _a !== void 0 ? _a : 0;
-            const { x1, x2, y1, y2 } = operateMaskBounds;
-            const regionStartAttr = isHorizontal ? 'x' : 'y';
-            const boundsStart = isHorizontal ? x1 : y1;
-            const boundsEnd = isHorizontal ? x2 : y2;
-            dataZooms.forEach((dz) => {
-                const startValue = dz.relatedAxisComponent && inBrushDataValue.length > 0
-                    ? dz.relatedAxisComponent
-                        .getScale()
-                        .invert(boundsStart - region.getLayoutStartPoint()[regionStartAttr])
-                    : this._findValueInDataZoom(dz, inBrushDataValue, 'min');
-                const endValue = dz.relatedAxisComponent && inBrushDataValue.length > 0
-                    ? dz.relatedAxisComponent
-                        .getScale()
-                        .invert(boundsEnd - region.getLayoutStartPoint()[regionStartAttr])
-                    : this._findValueInDataZoom(dz, inBrushDataValue, 'max');
-                const startPercent = dz.dataToStatePoint(startValue);
-                const endPercent = dz.dataToStatePoint(endValue);
-                dz.setStartAndEnd(Math.min(Math.max(0, startPercent - range), 1), Math.min(Math.max(0, endPercent + range), 1), [
-                    'percent',
-                    'percent'
-                ]);
-            });
-        }
-        _setDataZoomState(operateMask, region) {
-            const hDataZooms = [];
-            const vDataZooms = [];
-            this._relatedDataZooms.forEach(dz => {
-                if (dz.isHorizontal) {
-                    hDataZooms.push(dz);
-                }
-                else {
-                    vDataZooms.push(dz);
-                }
-            });
-            const operateMaskBounds = operateMask.AABBBounds;
-            const inBrushDataXValue = [];
-            const inBrushDataYValue = [];
-            this._extendDataInBrush(this._inBrushElementsMap).forEach(item => {
-                const spec = item.getSeries().getSpec();
-                inBrushDataXValue.push(item[array(spec.xField)[0]]);
-                inBrushDataYValue.push(item[array(spec.yField)[0]]);
-            });
-            this._setDataZoomComponent(hDataZooms, region, operateMaskBounds, inBrushDataXValue, true);
-            this._setDataZoomComponent(vDataZooms, region, operateMaskBounds, inBrushDataYValue, false);
-        }
         _bindRegions() {
             if (isValid$3(this._spec.regionId) && isValid$3(this._spec.regionIndex)) {
                 this._relativeRegions = this._option.getAllRegions();
@@ -91981,18 +91827,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
             this._linkedSeries = this._option.getSeriesInUserIdOrIndex(array(this._spec.brushLinkSeriesId), array(this._spec.brushLinkSeriesIndex));
         }
-        _bindDataZoom() {
-            if (this._spec.dataZoomId) {
-                array(this._spec.dataZoomId).forEach((dataZoomId) => {
-                    this._relatedDataZooms.push(this._option.getComponentByUserId(dataZoomId));
-                });
-            }
-            if (this._spec.dataZoomIndex) {
-                array(this._spec.dataZoomIndex).forEach((dataZoomIndex) => {
-                    this._relatedDataZooms.push(this._option.getComponentByIndex('dataZoom', dataZoomIndex));
-                });
-            }
-        }
         _initNeedOperatedItem() {
             const seriesUserId = this._spec.seriesId;
             const seriesIndex = this._spec.seriesIndex;
@@ -92002,10 +91836,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     if ((seriesUserId && array(seriesUserId).includes(s.userId.toString())) ||
                         (seriesIndex && array(seriesIndex).includes(s.getSpecIndex())) ||
                         (!seriesIndex && !seriesUserId)) {
-                        allMarks.push(...s.getMarksWithoutRoot().map(mark => {
-                            mark.getSeries = () => s;
-                            return mark;
-                        }));
+                        allMarks.push(...s.getMarksWithoutRoot());
                     }
                     this._itemMap[r.id] = allMarks;
                 });