@visactor/vchart 1.13.11 → 1.13.13-alpha.0

package/build/index.es.js

@@ -7840,11 +7840,14 @@ class Container {
 const ContributionProvider = Symbol("ContributionProvider");
 class ContributionProviderCache {
   constructor(serviceIdentifier, container) {
-    this.serviceIdentifier = serviceIdentifier, this.container = container;
+    this.serviceIdentifier = serviceIdentifier, this.container = container, ContributionStore.setStore(this.serviceIdentifier, this);
   }
   getContributions() {
     return this.caches || (this.caches = [], this.container && this.container.isBound(this.serviceIdentifier) && this.caches.push(...this.container.getAll(this.serviceIdentifier))), this.caches;
   }
+  refresh() {
+    this.caches && (this.caches.length = 0, this.container && this.container.isBound(this.serviceIdentifier) && this.caches.push(...this.container.getAll(this.serviceIdentifier)));
+  }
 }
 function bindContributionProvider(bind, id) {
   bind(ContributionProvider).toDynamicValue(_ref => {
@@ -7862,6 +7865,20 @@ function bindContributionProviderNoSingletonScope(bind, id) {
     return new ContributionProviderCache(id, container);
   }).whenTargetNamed(id);
 }
+class ContributionStore {
+  static getStore(id) {
+    return this.store.get(id);
+  }
+  static setStore(id, cache) {
+    this.store.set(id, cache);
+  }
+  static refreshAllContributions() {
+    this.store.forEach(cache => {
+      cache.refresh();
+    });
+  }
+}
+ContributionStore.store = new Map();
 
 class Hook {
   constructor(args, name) {
@@ -7928,6 +7945,48 @@ const EnvContribution = Symbol.for("EnvContribution");
 const VGlobal = Symbol.for("VGlobal");
 const DEFAULT_TEXT_FONT_FAMILY$1 = "PingFang SC,Helvetica Neue,Microsoft Yahei,system-ui,-apple-system,segoe ui,Roboto,Helvetica,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol";
 
+class EventListenerManager {
+  constructor() {
+    this._listenerMap = new Map(), this._eventListenerTransformer = event => event;
+  }
+  setEventListenerTransformer(transformer) {
+    this._eventListenerTransformer = transformer || (event => event);
+  }
+  addEventListener(type, listener, options) {
+    if (!listener) return;
+    const wrappedListener = event => {
+      const transformedEvent = this._eventListenerTransformer(event);
+      "function" == typeof listener ? listener(transformedEvent) : listener.handleEvent && listener.handleEvent(transformedEvent);
+    };
+    this._listenerMap.has(type) || this._listenerMap.set(type, new Map()), this._listenerMap.get(type).set(listener, wrappedListener), this._nativeAddEventListener(type, wrappedListener, options);
+  }
+  removeEventListener(type, listener, options) {
+    var _a;
+    if (!listener) return;
+    const wrappedListener = null === (_a = this._listenerMap.get(type)) || void 0 === _a ? void 0 : _a.get(listener);
+    wrappedListener && (this._nativeRemoveEventListener(type, wrappedListener, options), this._listenerMap.get(type).delete(listener), 0 === this._listenerMap.get(type).size && this._listenerMap.delete(type));
+  }
+  dispatchEvent(event) {
+    return this._nativeDispatchEvent(event);
+  }
+  clearAllEventListeners() {
+    this._listenerMap.forEach((listenersMap, type) => {
+      listenersMap.forEach((wrappedListener, originalListener) => {
+        this._nativeRemoveEventListener(type, wrappedListener, void 0);
+      });
+    }), this._listenerMap.clear();
+  }
+  _nativeAddEventListener(type, listener, options) {
+    throw new Error("_nativeAddEventListener must be implemented by derived classes");
+  }
+  _nativeRemoveEventListener(type, listener, options) {
+    throw new Error("_nativeRemoveEventListener must be implemented by derived classes");
+  }
+  _nativeDispatchEvent(event) {
+    throw new Error("_nativeDispatchEvent must be implemented by derived classes");
+  }
+}
+
 var __decorate$1B = undefined && undefined.__decorate || function (decorators, target, key, desc) {
     var d,
       c = arguments.length,
@@ -7968,7 +8027,7 @@ var __decorate$1B = undefined && undefined.__decorate || function (decorators, t
       step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
   };
-let DefaultGlobal = class {
+let DefaultGlobal = class extends EventListenerManager {
   get env() {
     return this._env;
   }
@@ -8012,10 +8071,19 @@ let DefaultGlobal = class {
     this._env || this.setEnv("browser"), this.envContribution.applyStyles = support;
   }
   constructor(contributions) {
-    this.contributions = contributions, this._isImageAnonymous = !0, this.id = Generator.GenAutoIncrementId(), this.hooks = {
+    super(), this.contributions = contributions, this._isImageAnonymous = !0, this.eventListenerTransformer = event => event, this.id = Generator.GenAutoIncrementId(), this.hooks = {
       onSetEnv: new SyncHook(["lastEnv", "env", "global"])
     }, this.measureTextMethod = "native", this.optimizeVisible = !1;
   }
+  _nativeAddEventListener(type, listener, options) {
+    return this._env || this.setEnv("browser"), this.envContribution.addEventListener(type, listener, options);
+  }
+  _nativeRemoveEventListener(type, listener, options) {
+    return this._env || this.setEnv("browser"), this.envContribution.removeEventListener(type, listener, options);
+  }
+  _nativeDispatchEvent(event) {
+    return this._env || this.setEnv("browser"), this.envContribution.dispatchEvent(event);
+  }
   bindContribution(params) {
     const promiseArr = [];
     if (this.contributions.getContributions().forEach(contribution => {
@@ -8056,15 +8124,6 @@ let DefaultGlobal = class {
   releaseCanvas(canvas) {
     return this._env || this.setEnv("browser"), this.envContribution.releaseCanvas(canvas);
   }
-  addEventListener(type, listener, options) {
-    return this._env || this.setEnv("browser"), this.envContribution.addEventListener(type, listener, options);
-  }
-  removeEventListener(type, listener, options) {
-    return this._env || this.setEnv("browser"), this.envContribution.removeEventListener(type, listener, options);
-  }
-  dispatchEvent(event) {
-    return this._env || this.setEnv("browser"), this.envContribution.dispatchEvent(event);
-  }
   getRequestAnimationFrame() {
     return this._env || this.setEnv("browser"), this.envContribution.getRequestAnimationFrame();
   }
@@ -11093,7 +11152,7 @@ var __decorate$1y = undefined && undefined.__decorate || function (decorators, t
   };
 const VWindow = Symbol.for("VWindow");
 const WindowHandlerContribution = Symbol.for("WindowHandlerContribution");
-let DefaultWindow = class {
+let DefaultWindow = class extends EventListenerManager {
   get width() {
     if (this._handler) {
       const wh = this._handler.getWH();
@@ -11112,7 +11171,7 @@ let DefaultWindow = class {
     return this._handler.getDpr();
   }
   constructor() {
-    this.hooks = {
+    super(), this.hooks = {
       onChange: new SyncHook(["x", "y", "width", "height"])
     }, this.active = () => {
       const global = this.global;
@@ -11120,6 +11179,15 @@ let DefaultWindow = class {
       container.getNamed(WindowHandlerContribution, global.env).configure(this, global), this.actived = !0;
     }, this._uid = Generator.GenAutoIncrementId(), this.global = application.global, this.postInit();
   }
+  _nativeAddEventListener(type, listener, options) {
+    return this._handler.addEventListener(type, listener, options);
+  }
+  _nativeRemoveEventListener(type, listener, options) {
+    return this._handler.removeEventListener(type, listener, options);
+  }
+  _nativeDispatchEvent(event) {
+    return this._handler.dispatchEvent(event);
+  }
   postInit() {
     this.global.hooks.onSetEnv.tap("window", this.active), this.active();
   }
@@ -11159,7 +11227,7 @@ let DefaultWindow = class {
     throw new Error("暂不支持");
   }
   release() {
-    return this.global.hooks.onSetEnv.unTap("window", this.active), this._handler.releaseWindow();
+    return this.global.hooks.onSetEnv.unTap("window", this.active), this.clearAllEventListeners(), this._handler.releaseWindow();
   }
   getContext() {
     return this._handler.getContext();
@@ -11170,15 +11238,6 @@ let DefaultWindow = class {
   getImageBuffer(type) {
     return this._handler.getImageBuffer ? this._handler.getImageBuffer(type) : null;
   }
-  addEventListener(type, listener, options) {
-    return this._handler.addEventListener(type, listener, options);
-  }
-  removeEventListener(type, listener, options) {
-    return this._handler.removeEventListener(type, listener, options);
-  }
-  dispatchEvent(event) {
-    return this._handler.dispatchEvent(event);
-  }
   getBoundingClientRect() {
     return this._handler.getBoundingClientRect();
   }
@@ -12387,19 +12446,17 @@ class EventSystem {
       globalObj: globalObj,
       domElement: domElement
     } = this;
-    this.supportsPointerEvents ? (globalObj.getDocument() ? (globalObj.getDocument().addEventListener("pointermove", this.onPointerMove, !0), globalObj.getDocument().addEventListener("pointerup", this.onPointerUp, !0)) : (domElement.addEventListener("pointermove", this.onPointerMove, !0), domElement.addEventListener("pointerup", this.onPointerUp, !0)), domElement.addEventListener("pointerdown", this.onPointerDown, !0), domElement.addEventListener("pointerleave", this.onPointerOverOut, !0), domElement.addEventListener("pointerover", this.onPointerOverOut, !0)) : (globalObj.getDocument() ? (globalObj.getDocument().addEventListener("mousemove", this.onPointerMove, !0), globalObj.getDocument().addEventListener("mouseup", this.onPointerUp, !0)) : (domElement.addEventListener("mousemove", this.onPointerMove, !0), domElement.addEventListener("mouseup", this.onPointerUp, !0)), domElement.addEventListener("mousedown", this.onPointerDown, !0), domElement.addEventListener("mouseout", this.onPointerOverOut, !0), domElement.addEventListener("mouseover", this.onPointerOverOut, !0)), this.supportsTouchEvents && (domElement.addEventListener("touchstart", this.onPointerDown, !0), domElement.addEventListener("touchend", this.onPointerUp, !0), domElement.addEventListener("touchmove", this.onPointerMove, !0)), domElement.addEventListener("wheel", this.onWheel, {
+    this.supportsPointerEvents ? (globalObj.getDocument() ? (globalObj.addEventListener("pointermove", this.onPointerMove, !0), globalObj.addEventListener("pointerup", this.onPointerUp, !0)) : (domElement.addEventListener("pointermove", this.onPointerMove, !0), domElement.addEventListener("pointerup", this.onPointerUp, !0)), domElement.addEventListener("pointerdown", this.onPointerDown, !0), domElement.addEventListener("pointerleave", this.onPointerOverOut, !0), domElement.addEventListener("pointerover", this.onPointerOverOut, !0)) : (globalObj.getDocument() ? (globalObj.addEventListener("mousemove", this.onPointerMove, !0), globalObj.addEventListener("mouseup", this.onPointerUp, !0)) : (domElement.addEventListener("mousemove", this.onPointerMove, !0), domElement.addEventListener("mouseup", this.onPointerUp, !0)), domElement.addEventListener("mousedown", this.onPointerDown, !0), domElement.addEventListener("mouseout", this.onPointerOverOut, !0), domElement.addEventListener("mouseover", this.onPointerOverOut, !0)), this.supportsTouchEvents && (domElement.addEventListener("touchstart", this.onPointerDown, !0), domElement.addEventListener("touchend", this.onPointerUp, !0), domElement.addEventListener("touchmove", this.onPointerMove, !0)), domElement.addEventListener("wheel", this.onWheel, {
       capture: !0
     }), this.eventsAdded = !0;
   }
   removeEvents() {
-    var _a;
     if (!this.eventsAdded || !this.domElement) return;
     const {
-        globalObj: globalObj,
-        domElement: domElement
-      } = this,
-      globalDocument = null !== (_a = globalObj.getDocument()) && void 0 !== _a ? _a : domElement;
-    this.supportsPointerEvents ? (globalDocument.removeEventListener("pointermove", this.onPointerMove, !0), globalDocument.removeEventListener("pointerup", this.onPointerUp, !0), domElement.removeEventListener("pointerdown", this.onPointerDown, !0), domElement.removeEventListener("pointerleave", this.onPointerOverOut, !0), domElement.removeEventListener("pointerover", this.onPointerOverOut, !0)) : (globalDocument.removeEventListener("mousemove", this.onPointerMove, !0), globalDocument.removeEventListener("mouseup", this.onPointerUp, !0), domElement.removeEventListener("mousedown", this.onPointerDown, !0), domElement.removeEventListener("mouseout", this.onPointerOverOut, !0), domElement.removeEventListener("mouseover", this.onPointerOverOut, !0)), this.supportsTouchEvents && (domElement.removeEventListener("touchstart", this.onPointerDown, !0), domElement.removeEventListener("touchend", this.onPointerUp, !0), domElement.removeEventListener("touchmove", this.onPointerMove, !0)), domElement.removeEventListener("wheel", this.onWheel, !0), this.domElement = null, this.eventsAdded = !1;
+      globalObj: globalObj,
+      domElement: domElement
+    } = this;
+    this.supportsPointerEvents ? (globalObj.getDocument() ? (globalObj.removeEventListener("pointermove", this.onPointerMove, !0), globalObj.removeEventListener("pointerup", this.onPointerUp, !0)) : (domElement.removeEventListener("pointermove", this.onPointerMove, !0), domElement.removeEventListener("pointerup", this.onPointerUp, !0)), domElement.removeEventListener("pointerdown", this.onPointerDown, !0), domElement.removeEventListener("pointerleave", this.onPointerOverOut, !0), domElement.removeEventListener("pointerover", this.onPointerOverOut, !0)) : (globalObj.getDocument() ? (globalObj.removeEventListener("mousemove", this.onPointerMove, !0), globalObj.removeEventListener("mouseup", this.onPointerUp, !0)) : (domElement.removeEventListener("mousemove", this.onPointerMove, !0), domElement.removeEventListener("mouseup", this.onPointerUp, !0)), domElement.removeEventListener("mousedown", this.onPointerDown, !0), domElement.removeEventListener("mouseout", this.onPointerOverOut, !0), domElement.removeEventListener("mouseover", this.onPointerOverOut, !0)), this.supportsTouchEvents && (domElement.removeEventListener("touchstart", this.onPointerDown, !0), domElement.removeEventListener("touchend", this.onPointerUp, !0), domElement.removeEventListener("touchmove", this.onPointerMove, !0)), domElement.removeEventListener("wheel", this.onWheel, !0), this.domElement = null, this.eventsAdded = !1;
   }
   mapToViewportPoint(event) {
     return this.domElement.pointTransform ? this.domElement.pointTransform(event.x, event.y) : event;
@@ -13653,23 +13710,27 @@ class TagPointsUpdate extends ACustomAnimate {
     isValidNumber$1(lastClipRange * this.clipRange) && (this.clipRange *= lastClipRange);
   }
   onUpdate(end, ratio, out) {
-    if (this.points = this.points.map((point, index) => {
-      const newPoint = pointInterpolation(this.interpolatePoints[index][0], this.interpolatePoints[index][1], ratio);
-      return newPoint.context = point.context, newPoint;
-    }), this.clipRange) {
-      if (this.shrinkClipRange) return void (end ? (out.points = this.toPoints, out.clipRange = 1) : (out.points = this.fromPoints, out.clipRange = this.clipRange - (this.clipRange - this.shrinkClipRange) * ratio));
-      out.clipRange = this.clipRange + (1 - this.clipRange) * ratio;
-    }
-    if (this.segmentsCache && this.to.segments) {
-      let start = 0;
-      out.segments = this.to.segments.map((segment, index) => {
-        const end = start + this.segmentsCache[index],
-          points = this.points.slice(start, end);
-        return start = end, Object.assign(Object.assign({}, segment), {
-          points: points
+    if (end) Object.keys(this.to).forEach(k => {
+      out[k] = this.to[k];
+    });else {
+      if (this.points = this.points.map((point, index) => {
+        const newPoint = pointInterpolation(this.interpolatePoints[index][0], this.interpolatePoints[index][1], ratio);
+        return newPoint.context = point.context, newPoint;
+      }), this.clipRange) {
+        if (this.shrinkClipRange) return void (end ? (out.points = this.toPoints, out.clipRange = 1) : (out.points = this.fromPoints, out.clipRange = this.clipRange - (this.clipRange - this.shrinkClipRange) * ratio));
+        out.clipRange = this.clipRange + (1 - this.clipRange) * ratio;
+      }
+      if (this.segmentsCache && this.to.segments) {
+        let start = 0;
+        out.segments = this.to.segments.map((segment, index) => {
+          const end = start + this.segmentsCache[index],
+            points = this.points.slice(start, end);
+          return start = end, Object.assign(Object.assign({}, segment), {
+            points: points
+          });
         });
-      });
-    } else out.points = this.points;
+      } else out.points = this.points;
+    }
   }
 }
 class ClipGraphicAnimate extends ACustomAnimate {
@@ -21074,6 +21135,9 @@ class BaseRender {
   init(contributions) {
     contributions && (this._renderContribitions = contributions.getContributions()), this._renderContribitions || (this._renderContribitions = []), this.builtinContributions || (this.builtinContributions = []), this.builtinContributions.push(defaultBaseClipRenderBeforeContribution), this.builtinContributions.push(defaultBaseClipRenderAfterContribution), this.builtinContributions.forEach(item => this._renderContribitions.push(item)), this._renderContribitions.length && (this._renderContribitions.sort((a, b) => b.order - a.order), this._beforeRenderContribitions = this._renderContribitions.filter(c => c.time === BaseRenderContributionTime.beforeFillStroke), this._afterRenderContribitions = this._renderContribitions.filter(c => c.time === BaseRenderContributionTime.afterFillStroke));
   }
+  reInit() {
+    this.init(this.graphicRenderContributions);
+  }
   beforeRenderStep(graphic, context, x, y, doFill, doStroke, fVisible, sVisible, graphicAttribute, drawContext, fillCb, strokeCb, params) {
     this._beforeRenderContribitions && this._beforeRenderContribitions.forEach(c => {
       if (c.supportedAppName && graphic.stage && graphic.stage.params && graphic.stage.params.context && graphic.stage.params.context.appName) {
@@ -21243,8 +21307,8 @@ var __decorate$1s = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasArcRender = class extends BaseRender {
-  constructor(arcRenderContribitions) {
-    super(), this.arcRenderContribitions = arcRenderContribitions, this.numberType = ARC_NUMBER_TYPE, this.builtinContributions = [defaultArcRenderContribution, defaultArcBackgroundRenderContribution, defaultArcTextureRenderContribution], this.init(arcRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = ARC_NUMBER_TYPE, this.builtinContributions = [defaultArcRenderContribution, defaultArcBackgroundRenderContribution, defaultArcTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawArcTailCapPath(arc, context, cx, cy, outerRadius, innerRadius, _sa, _ea) {
     const capAngle = _ea - _sa,
@@ -21419,8 +21483,8 @@ var __decorate$1r = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasCircleRender = class extends BaseRender {
-  constructor(circleRenderContribitions) {
-    super(), this.circleRenderContribitions = circleRenderContribitions, this.numberType = CIRCLE_NUMBER_TYPE, this.builtinContributions = [defaultCircleRenderContribution, defaultCircleBackgroundRenderContribution, defaultCircleTextureRenderContribution], this.init(circleRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = CIRCLE_NUMBER_TYPE, this.builtinContributions = [defaultCircleRenderContribution, defaultCircleBackgroundRenderContribution, defaultCircleTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(circle, context, x, y, drawContext, params, fillCb, strokeCb) {
     const circleAttribute = getTheme$1(circle, null == params ? void 0 : params.theme).circle,
@@ -21806,8 +21870,8 @@ var __decorate$1p = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasAreaRender = class extends BaseRender {
-  constructor(areaRenderContribitions) {
-    super(), this.areaRenderContribitions = areaRenderContribitions, this.numberType = AREA_NUMBER_TYPE, this.builtinContributions = [defaultAreaTextureRenderContribution, defaultAreaBackgroundRenderContribution], this.init(areaRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = AREA_NUMBER_TYPE, this.builtinContributions = [defaultAreaTextureRenderContribution, defaultAreaBackgroundRenderContribution], this.init(graphicRenderContributions);
   }
   drawLinearAreaHighPerformance(area, context, fill, stroke, fillOpacity, strokeOpacity, offsetX, offsetY, areaAttribute, drawContext, params, fillCb, strokeCb) {
     var _a, _b, _c;
@@ -22050,8 +22114,8 @@ var __decorate$1o = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasPathRender = class extends BaseRender {
-  constructor(pathRenderContribitions) {
-    super(), this.pathRenderContribitions = pathRenderContribitions, this.numberType = PATH_NUMBER_TYPE, this.builtinContributions = [defaultPathBackgroundRenderContribution, defaultPathTextureRenderContribution], this.init(pathRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = PATH_NUMBER_TYPE, this.builtinContributions = [defaultPathBackgroundRenderContribution, defaultPathTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(path, context, x, y, drawContext, params, fillCb, strokeCb) {
     var _a, _b, _c;
@@ -22106,8 +22170,8 @@ var __decorate$1n = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasRectRender = class extends BaseRender {
-  constructor(rectRenderContribitions) {
-    super(), this.rectRenderContribitions = rectRenderContribitions, this.type = "rect", this.numberType = RECT_NUMBER_TYPE, this.builtinContributions = [defaultRectRenderContribution, defaultRectBackgroundRenderContribution, defaultRectTextureRenderContribution], this.init(rectRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.type = "rect", this.numberType = RECT_NUMBER_TYPE, this.builtinContributions = [defaultRectRenderContribution, defaultRectBackgroundRenderContribution, defaultRectTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(rect, context, x, y, drawContext, params, fillCb, strokeCb) {
     var _a;
@@ -22178,8 +22242,8 @@ var __decorate$1m = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasSymbolRender = class extends BaseRender {
-  constructor(symbolRenderContribitions) {
-    super(), this.symbolRenderContribitions = symbolRenderContribitions, this.numberType = SYMBOL_NUMBER_TYPE, this.builtinContributions = [defaultSymbolRenderContribution, defaultSymbolBackgroundRenderContribution, defaultSymbolTextureRenderContribution, defaultSymbolClipRangeStrokeRenderContribution], this.init(symbolRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = SYMBOL_NUMBER_TYPE, this.builtinContributions = [defaultSymbolRenderContribution, defaultSymbolBackgroundRenderContribution, defaultSymbolTextureRenderContribution, defaultSymbolClipRangeStrokeRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(symbol, context, x, y, drawContext, params, fillCb, strokeCb) {
     var _a;
@@ -22350,8 +22414,8 @@ var __decorate$1l = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasTextRender = class extends BaseRender {
-  constructor(textRenderContribitions) {
-    super(), this.textRenderContribitions = textRenderContribitions, this.numberType = TEXT_NUMBER_TYPE, this.builtinContributions = [defaultTextBackgroundRenderContribution], this.init(textRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = TEXT_NUMBER_TYPE, this.builtinContributions = [defaultTextBackgroundRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(text, context, x, y, drawContext, params, fillCb, strokeCb) {
     var _a, _b, _c;
@@ -22555,8 +22619,8 @@ var __decorate$1k = undefined && undefined.__decorate || function (decorators, t
     };
   };
 let DefaultCanvasPolygonRender = class extends BaseRender {
-  constructor(polygonRenderContribitions) {
-    super(), this.polygonRenderContribitions = polygonRenderContribitions, this.numberType = POLYGON_NUMBER_TYPE, this.builtinContributions = [defaultPolygonBackgroundRenderContribution, defaultPolygonTextureRenderContribution], this.init(polygonRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = POLYGON_NUMBER_TYPE, this.builtinContributions = [defaultPolygonBackgroundRenderContribution, defaultPolygonTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(polygon, context, x, y, drawContext, params, fillCb, strokeCb) {
     const polygonAttribute = getTheme$1(polygon, null == params ? void 0 : params.theme).polygon,
@@ -22611,6 +22675,9 @@ let DefaultCanvasGroupRender = class {
   constructor(groupRenderContribitions) {
     this.groupRenderContribitions = groupRenderContribitions, this.numberType = GROUP_NUMBER_TYPE;
   }
+  reInit() {
+    this._groupRenderContribitions = this.groupRenderContribitions.getContributions() || [], this._groupRenderContribitions.push(defaultGroupBackgroundRenderContribution);
+  }
   drawShape(group, context, x, y, drawContext, params, fillCb, strokeCb) {
     const groupAttribute = getTheme$1(group, null == params ? void 0 : params.theme).group,
       {
@@ -22741,8 +22808,8 @@ var __decorate$1i = undefined && undefined.__decorate || function (decorators, t
   };
 const repeatStr = ["", "repeat-x", "repeat-y", "repeat"];
 let DefaultCanvasImageRender = class extends BaseRender {
-  constructor(imageRenderContribitions) {
-    super(), this.imageRenderContribitions = imageRenderContribitions, this.numberType = IMAGE_NUMBER_TYPE, this.builtinContributions = [defaultImageRenderContribution, defaultImageBackgroundRenderContribution], this.init(imageRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = IMAGE_NUMBER_TYPE, this.builtinContributions = [defaultImageRenderContribution, defaultImageBackgroundRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(image, context, x, y, drawContext, params, fillCb, strokeCb) {
     const imageAttribute = getTheme$1(image).image,
@@ -23069,6 +23136,9 @@ let DefaultRenderService = class {
   afterDraw(params) {
     this.drawContribution.afterDraw && this.drawContribution.afterDraw(this, Object.assign({}, this.drawParams));
   }
+  reInit() {
+    this.drawContribution.reInit();
+  }
   render(groups, params) {
     this.renderTreeRoots = groups, this.drawParams = params;
     const updateBounds = params.updateBounds;
@@ -23470,6 +23540,11 @@ let DefaultDrawContribution = class {
   constructor(contributions, drawItemInterceptorContributions) {
     this.contributions = contributions, this.drawItemInterceptorContributions = drawItemInterceptorContributions, this.currentRenderMap = new Map(), this.defaultRenderMap = new Map(), this.styleRenderMap = new Map(), this.dirtyBounds = new Bounds(), this.backupDirtyBounds = new Bounds(), this.global = application.global, this.layerService = application.layerService, isArray$1(this.contributions) || (this.contributions = [this.contributions]), this.init();
   }
+  reInit() {
+    this.init(), this.contributions.forEach(item => {
+      item.reInit();
+    });
+  }
   init() {
     this.contributions.forEach(item => {
       if (item.style) {
@@ -24589,6 +24664,9 @@ class Stage extends Group$1 {
   getPickerService() {
     return this.pickerService || (this.pickerService = container.get(PickerService)), this.pickerService;
   }
+  reInit() {
+    this.renderService.reInit(), this.pickerService.reInit();
+  }
 }
 
 function createStage(params) {
@@ -25186,6 +25264,9 @@ let DefaultPickService = class {
   constructor(pickItemInterceptorContributions, pickServiceInterceptorContributions) {
     this.pickItemInterceptorContributions = pickItemInterceptorContributions, this.pickServiceInterceptorContributions = pickServiceInterceptorContributions, this.type = "default", this.global = application.global;
   }
+  reInit() {
+    this._init();
+  }
   _init() {
     this.InterceptorContributions = this.pickItemInterceptorContributions.getContributions().sort((a, b) => a.order - b.order), this.pickerServiceInterceptorContributions = this.pickServiceInterceptorContributions.getContributions().sort((a, b) => a.order - b.order);
   }
@@ -25354,6 +25435,7 @@ let DefaultCanvasGlyphRender = class {
   constructor() {
     this.numberType = GLYPH_NUMBER_TYPE;
   }
+  reInit() {}
   drawShape(glyph, context, x, y, drawContext, params, fillCb, strokeCb) {
     drawContext.drawContribution && glyph.getSubGraphic().forEach(item => {
       const renderer = drawContext.drawContribution.getRenderContribution(item);
@@ -26578,6 +26660,18 @@ class AbstractComponent extends Group$1 {
     const changeEvent = new CustomEvent(eventName, details);
     changeEvent.manager = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.eventSystem.manager, this.dispatchEvent(changeEvent);
   }
+  eventPosToStagePos(e) {
+    var _a, _b;
+    const result = {
+        x: 0,
+        y: 0
+      },
+      stagePoints = null !== (_b = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.eventPointTransform(e)) && void 0 !== _b ? _b : {
+        x: 0,
+        y: 0
+      };
+    return this.globalTransMatrix.transformPoint(stagePoints, result), result;
+  }
 }
 
 const MathPickerContribution = Symbol.for("MathPickerContribution");
@@ -35342,7 +35436,7 @@ const labelOverlap = function (prevLabel, nextLabel) {
 const MIN_TICK_GAP = 12;
 const calculateFlushPos = (basePosition, size, rangePosition, otherEnd) => rangePosition < basePosition ? Math.max(basePosition - size / 2, rangePosition) : rangePosition > basePosition ? Math.min(basePosition - size / 2, rangePosition - size) : rangePosition < otherEnd ? rangePosition : rangePosition - size;
 const getCartesianLabelBounds = (scale, domain, op) => {
-  var _a;
+  var _a, _b, _c;
   const {
     labelStyle: labelStyle,
     axisOrientType: axisOrientType,
@@ -35358,27 +35452,32 @@ const getCartesianLabelBounds = (scale, domain, op) => {
     scaleY = 0;
   isHorizontal || (isVertical ? (scaleX = 0, scaleY = 1) : startAngle && (scaleX = Math.cos(startAngle), scaleY = -Math.sin(startAngle)));
   const textMeasure = initTextMeasure$1(labelStyle),
-    range = scale.range(),
-    labelBoundsList = domain.map((v, i) => {
-      var _a, _b;
-      const str = labelFormatter ? labelFormatter(v) : `${v}`,
-        {
-          width: width,
-          height: height
-        } = textMeasure.quickMeasure(str),
-        textWidth = Math.max(width, 12),
-        textHeight = Math.max(height, 12),
-        pos = scale.scale(v),
-        baseTextX = scaleX * pos,
-        baseTextY = scaleY * pos;
-      let align,
-        baseline,
-        textX = baseTextX,
-        textY = baseTextY;
-      labelFlush && isHorizontal && 0 === i ? textX = calculateFlushPos(baseTextX, textWidth, range[0], range[range.length - 1]) : labelFlush && isHorizontal && i === domain.length - 1 ? textX = calculateFlushPos(baseTextX, textWidth, range[range.length - 1], range[0]) : align = null !== (_a = labelStyle.textAlign) && void 0 !== _a ? _a : "center", "right" === align ? textX -= textWidth : "center" === align && (textX -= textWidth / 2), labelFlush && isVertical && 0 === i ? textY = calculateFlushPos(baseTextY, textHeight, range[0], range[range.length - 1]) : labelFlush && isVertical && i === domain.length - 1 ? textY = calculateFlushPos(baseTextY, textHeight, range[range.length - 1], range[0]) : baseline = null !== (_b = labelStyle.textBaseline) && void 0 !== _b ? _b : "middle", "bottom" === baseline ? textY -= textHeight : "middle" === baseline && (textY -= textHeight / 2);
-      const bounds = new AABBBounds().set(textX, textY, textX + textWidth, textY + textHeight);
-      return labelAngle && bounds.rotate(labelAngle, baseTextX, baseTextY), bounds;
-    });
+    range = scale.range();
+  let labelBoundsList = [];
+  for (let i = 0; i < domain.length; i++) {
+    const v = domain[i],
+      str = labelFormatter ? labelFormatter(v) : `${v}`;
+    if (isPlainObject$1(str)) {
+      labelBoundsList = void 0;
+      break;
+    }
+    const {
+        width: width,
+        height: height
+      } = textMeasure.quickMeasure(str),
+      textWidth = Math.max(width, 12),
+      textHeight = Math.max(height, 12),
+      pos = scale.scale(v),
+      baseTextX = scaleX * pos,
+      baseTextY = scaleY * pos;
+    let align,
+      baseline,
+      textX = baseTextX,
+      textY = baseTextY;
+    labelFlush && isHorizontal && 0 === i ? textX = calculateFlushPos(baseTextX, textWidth, range[0], range[range.length - 1]) : labelFlush && isHorizontal && i === domain.length - 1 ? textX = calculateFlushPos(baseTextX, textWidth, range[range.length - 1], range[0]) : align = null !== (_b = labelStyle.textAlign) && void 0 !== _b ? _b : "center", "right" === align ? textX -= textWidth : "center" === align && (textX -= textWidth / 2), labelFlush && isVertical && 0 === i ? textY = calculateFlushPos(baseTextY, textHeight, range[0], range[range.length - 1]) : labelFlush && isVertical && i === domain.length - 1 ? textY = calculateFlushPos(baseTextY, textHeight, range[range.length - 1], range[0]) : baseline = null !== (_c = labelStyle.textBaseline) && void 0 !== _c ? _c : "middle", "bottom" === baseline ? textY -= textHeight : "middle" === baseline && (textY -= textHeight / 2);
+    const bounds = new AABBBounds().set(textX, textY, textX + textWidth, textY + textHeight);
+    labelAngle && bounds.rotate(labelAngle, baseTextX, baseTextY), labelBoundsList.push(bounds);
+  }
   return labelBoundsList;
 };
 const isAxisHorizontal = axisOrientType => ["bottom", "top", "z"].includes(axisOrientType);
@@ -36427,7 +36526,7 @@ function forceItemVisible(sourceItem, items, check, comparator) {
   }
 }
 const continuousTicks = (scale, op) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   if (!isContinuous(scale.type)) return convertDomainToTickData(scale.domain());
   const range = scale.range(),
     rangeSize = Math.abs(range[range.length - 1] - range[0]);
@@ -36479,23 +36578,25 @@ const continuousTicks = (scale, op) => {
         step = Math.floor(scaleTicks.length * MIN_FONT_SIZE / rangeSize);
       scaleTicks.forEach((tick, index) => {
         index % step != 0 && index !== scaleTicks.length - 1 || samplingScaleTicks.push(tick);
-      }), items = getCartesianLabelBounds(scale, samplingScaleTicks, op).map((bounds, i) => ({
+      }), items = null === (_c = getCartesianLabelBounds(scale, samplingScaleTicks, op)) || void 0 === _c ? void 0 : _c.map((bounds, i) => ({
         AABBBounds: bounds,
         value: samplingScaleTicks[i]
       }));
-    } else items = getCartesianLabelBounds(scale, scaleTicks, op).map((bounds, i) => ({
+    } else items = null === (_d = getCartesianLabelBounds(scale, scaleTicks, op)) || void 0 === _d ? void 0 : _d.map((bounds, i) => ({
       AABBBounds: bounds,
       value: scaleTicks[i]
     }));
-    const firstSourceItem = items[0],
-      lastSourceItem = last(items),
-      samplingMethod = breakData && breakData() ? methods$1.greedy : methods$1.parity;
-    for (; items.length >= 3 && hasOverlap$1(items, labelGap);) items = samplingMethod(items, labelGap);
-    const checkFirst = op.labelFirstVisible;
-    let checkLast = op.labelLastVisible;
-    textIntersect(firstSourceItem, lastSourceItem, labelGap) && items.includes(lastSourceItem) && items.length > 1 && checkFirst && checkLast && (items.splice(items.indexOf(lastSourceItem), 1), checkLast = !1), forceItemVisible(firstSourceItem, items, checkFirst, item => textIntersect(item, firstSourceItem, labelGap)), forceItemVisible(lastSourceItem, items, checkLast, item => textIntersect(item, lastSourceItem, labelGap) || !(!checkFirst || item === firstSourceItem) && textIntersect(item, firstSourceItem, labelGap), !0);
-    const ticks = items.map(item => item.value);
-    ticks.length < 3 && labelFlush && (ticks.length > 1 && ticks.pop(), last(ticks) !== last(scaleTicks) && ticks.push(last(scaleTicks))), scaleTicks = ticks;
+    if (items) {
+      const firstSourceItem = items[0],
+        lastSourceItem = last(items),
+        samplingMethod = breakData && breakData() ? methods$1.greedy : methods$1.parity;
+      for (; items.length >= 3 && hasOverlap$1(items, labelGap);) items = samplingMethod(items, labelGap);
+      const checkFirst = op.labelFirstVisible;
+      let checkLast = op.labelLastVisible;
+      textIntersect(firstSourceItem, lastSourceItem, labelGap) && items.includes(lastSourceItem) && items.length > 1 && checkFirst && checkLast && (items.splice(items.indexOf(lastSourceItem), 1), checkLast = !1), forceItemVisible(firstSourceItem, items, checkFirst, item => textIntersect(item, firstSourceItem, labelGap)), forceItemVisible(lastSourceItem, items, checkLast, item => textIntersect(item, lastSourceItem, labelGap) || !(!checkFirst || item === firstSourceItem) && textIntersect(item, firstSourceItem, labelGap), !0);
+      const ticks = items.map(item => item.value);
+      ticks.length < 3 && labelFlush && (ticks.length > 1 && ticks.pop(), last(ticks) !== last(scaleTicks) && ticks.push(last(scaleTicks))), scaleTicks = ticks;
+    }
   }
   return convertDomainToTickData(scaleTicks);
 };
@@ -36509,7 +36610,10 @@ const methods$1 = {
   }
 };
 
-const getOneDimensionalLabelBounds = (scale, domain, op, isHorizontal) => getCartesianLabelBounds(scale, domain, op).map(bounds => isHorizontal ? [bounds.x1, bounds.x2, bounds.width()] : [bounds.y1, bounds.y2, bounds.height()]),
+const getOneDimensionalLabelBounds = (scale, domain, op, isHorizontal) => {
+    const labelBoundsList = getCartesianLabelBounds(scale, domain, op);
+    return labelBoundsList && labelBoundsList.map(bounds => isHorizontal ? [bounds.x1, bounds.x2, bounds.width()] : [bounds.y1, bounds.y2, bounds.height()]);
+  },
   boundsOverlap = function (prevBounds, nextBounds) {
     let gap = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
     return Math.max(prevBounds[0], nextBounds[0]) - gap / 2 <= Math.min(prevBounds[1], nextBounds[1]) + gap / 2;
@@ -36543,23 +36647,27 @@ const linearDiscreteTicks = (scale, op) => {
       rangeStart = minInArray(range),
       rangeEnd = maxInArray(range);
     if (domain.length <= rangeSize / fontSize) {
-      const incrementUnit = (rangeEnd - rangeStart) / domain.length,
-        labelBoundsList = getOneDimensionalLabelBounds(scale, domain, op, isHorizontal),
-        minBoundsLength = Math.min(...labelBoundsList.map(bounds => bounds[2])),
-        stepResult = getStep$1(domain, labelBoundsList, labelGap, op.labelLastVisible, Math.floor(minBoundsLength / incrementUnit), !1);
-      scaleTicks = scale.stepTicks(stepResult.step), op.labelLastVisible && (stepResult.delCount && (scaleTicks = scaleTicks.slice(0, scaleTicks.length - stepResult.delCount)), scaleTicks.push(domain[domain.length - 1]));
+      const labelBoundsList = getOneDimensionalLabelBounds(scale, domain, op, isHorizontal);
+      if (labelBoundsList) {
+        const minBoundsLength = Math.min(...labelBoundsList.map(bounds => bounds[2])),
+          incrementUnit = (rangeEnd - rangeStart) / domain.length,
+          stepResult = getStep$1(domain, labelBoundsList, labelGap, op.labelLastVisible, Math.floor(minBoundsLength / incrementUnit), !1);
+        scaleTicks = scale.stepTicks(stepResult.step), op.labelLastVisible && (stepResult.delCount && (scaleTicks = scaleTicks.slice(0, scaleTicks.length - stepResult.delCount)), scaleTicks.push(domain[domain.length - 1]));
+      }
     } else {
       const tempDomain = [domain[0], domain[Math.floor(domain.length / 2)], domain[domain.length - 1]],
         tempList = getOneDimensionalLabelBounds(scale, tempDomain, op, isHorizontal);
-      let maxBounds = null;
-      tempList.forEach(current => {
-        maxBounds ? maxBounds[2] < current[2] && (maxBounds = current) : maxBounds = current;
-      });
-      const step = rangeEnd - rangeStart - labelGap > 0 ? Math.ceil(domain.length * (labelGap + maxBounds[2]) / (rangeEnd - rangeStart - labelGap)) : domain.length - 1;
-      scaleTicks = scale.stepTicks(step), !op.labelLastVisible || scaleTicks.length && scaleTicks[scaleTicks.length - 1] === domain[domain.length - 1] || (scaleTicks.length && Math.abs(scale.scale(scaleTicks[scaleTicks.length - 1]) - scale.scale(domain[domain.length - 1])) < maxBounds[2] && (scaleTicks = scaleTicks.slice(0, -1)), scaleTicks.push(domain[domain.length - 1]));
+      if (tempList) {
+        let maxBounds = null;
+        tempList.forEach(current => {
+          maxBounds ? maxBounds[2] < current[2] && (maxBounds = current) : maxBounds = current;
+        });
+        const step = rangeEnd - rangeStart - labelGap > 0 ? Math.ceil(domain.length * (labelGap + maxBounds[2]) / (rangeEnd - rangeStart - labelGap)) : domain.length - 1;
+        scaleTicks = scale.stepTicks(step), !op.labelLastVisible || scaleTicks.length && scaleTicks[scaleTicks.length - 1] === domain[domain.length - 1] || (scaleTicks.length && Math.abs(scale.scale(scaleTicks[scaleTicks.length - 1]) - scale.scale(domain[domain.length - 1])) < maxBounds[2] && (scaleTicks = scaleTicks.slice(0, -1)), scaleTicks.push(domain[domain.length - 1]));
+      }
     }
-  } else scaleTicks = scale.domain();
-  return convertDomainToTickData(scaleTicks);
+  }
+  return isNil$1(scaleTicks) && (scaleTicks = scale.domain()), convertDomainToTickData(scaleTicks);
 };
 const getStep$1 = (domain, labelBoundsList, labelGap, labelLastVisible, defaultStep, areAllBoundsSame) => {
   let resultDelCount = 0,
@@ -39525,13 +39633,6 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
       end: end
     }));
   }
-  eventPosToStagePos(e) {
-    var _a, _b;
-    return null !== (_b = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.eventPointTransform(e)) && void 0 !== _b ? _b : {
-      x: 0,
-      y: 0
-    };
-  }
   _clearDragEvents() {
     const evtTarget = "browser" === vglobal.env ? vglobal : this.stage,
       triggers = getEndTriggersOfDrag();
@@ -39690,7 +39791,13 @@ let DataZoom$1 = class DataZoom extends AbstractComponent {
       } = this.attribute.startTextStyle;
     if (new Bounds().set(x1, y1, x2, y2).intersects(endTextBounds)) {
       const direction = "bottom" === this.attribute.orient || "right" === this.attribute.orient ? -1 : 1;
-      this._isHorizontal ? this._startText.setAttribute("dy", startTextDy + direction * Math.abs(endTextBounds.y1 - endTextBounds.y2)) : this._startText.setAttribute("dx", startTextDx + direction * Math.abs(endTextBounds.x1 - endTextBounds.x2));
+      if (this._isHorizontal) {
+        const boundsYDiff = Math.abs(endTextBounds.y1 - endTextBounds.y2);
+        this._startText.setAttribute("dy", startTextDy + direction * (Number.isFinite(boundsYDiff) ? boundsYDiff : 0));
+      } else {
+        const boundsXDiff = Math.abs(endTextBounds.x1 - endTextBounds.x2);
+        this._startText.setAttribute("dx", startTextDx + direction * (Number.isFinite(boundsXDiff) ? boundsXDiff : 0));
+      }
     } else this._isHorizontal ? this._startText.setAttribute("dy", startTextDy) : this._startText.setAttribute("dx", startTextDx);
   }
   getLayoutAttrFromConfig() {
@@ -44885,8 +44992,7 @@ const delayMap$1 = {
 loadBrushComponent();
 let Brush$1 = class Brush extends AbstractComponent {
   constructor(attributes, options) {
-    super((null == options ? void 0 : options.skipDefault) ? attributes : merge$1({}, Brush.defaultAttributes, attributes)), this.name = "brush", this._activeDrawState = !1, this._cacheDrawPoints = [], this._activeMoveState = !1, this._operatingMaskMoveDx = 0, this._operatingMaskMoveDy = 0, this._operatingMaskMoveRangeX = [-1 / 0, 1 / 0], this._operatingMaskMoveRangeY = [-1 / 0, 1 / 0], this._brushMaskAABBBoundsDict = {}, this._firstUpdate = !0, this._onBrushStart = e => {
-      if (this._outOfInteractiveRange(e)) return void (this._isEmptyMask() || (this._clearMask(), this._dispatchBrushEvent(IOperateType.brushClear, e)));
+    super((null == options ? void 0 : options.skipDefault) ? attributes : merge$1({}, Brush.defaultAttributes, attributes)), this.name = "brush", this._activeBrushState = !1, this._activeDrawState = !1, this._cacheDrawPoints = [], this._activeMoveState = !1, this._operatingMaskMoveDx = 0, this._operatingMaskMoveDy = 0, this._operatingMaskMoveRangeX = [-1 / 0, 1 / 0], this._operatingMaskMoveRangeY = [-1 / 0, 1 / 0], this._brushMaskAABBBoundsDict = {}, this._firstUpdate = !0, this._onBrushStart = e => {
       const {
         updateTrigger = DEFAULT_BRUSH_ATTRIBUTES.updateTrigger,
         endTrigger = DEFAULT_BRUSH_ATTRIBUTES.endTrigger,
@@ -44914,7 +45020,7 @@ let Brush$1 = class Brush extends AbstractComponent {
         brushMode: brushMode
       } = this.attribute,
       pos = this.eventPosToStagePos(e);
-    this._cacheDrawPoints.push(pos), "single" === brushMode && this._clearMask(), this._addBrushMask(), this._dispatchBrushEvent(IOperateType.drawStart, e), 1 === Object.keys(this._brushMaskAABBBoundsDict).length && this._dispatchBrushEvent(IOperateType.brushActive, e);
+    this._cacheDrawPoints.push(pos), "single" === brushMode && this._clearMask(), this._addBrushMask(), this._dispatchBrushEvent(IOperateType.drawStart, e), this._activeBrushState = !1;
   }
   _initMove(e) {
     var _a, _b;
@@ -44944,7 +45050,8 @@ let Brush$1 = class Brush extends AbstractComponent {
     var _a;
     const pos = this.eventPosToStagePos(e),
       {
-        brushType: brushType
+        brushType: brushType,
+        sizeThreshold = DEFAULT_SIZE_THRESHOLD
       } = this.attribute,
       cacheLength = this._cacheDrawPoints.length;
     if (cacheLength > 0) {
@@ -44953,7 +45060,16 @@ let Brush$1 = class Brush extends AbstractComponent {
     }
     "polygon" === brushType || cacheLength <= 1 ? this._cacheDrawPoints.push(pos) : this._cacheDrawPoints[cacheLength - 1] = pos;
     const maskPoints = this._computeMaskPoints();
-    this._operatingMask.setAttribute("points", maskPoints), this._dispatchBrushEvent(IOperateType.drawing, e);
+    this._operatingMask.setAttribute("points", maskPoints);
+    const {
+        x: x1,
+        y: y1
+      } = this._startPos,
+      {
+        x: x2,
+        y: y2
+      } = this.eventPosToStagePos(e);
+    (Math.abs(x2 - x1) > sizeThreshold || Math.abs(y1 - y2) > sizeThreshold) && (1 !== Object.keys(this._brushMaskAABBBoundsDict).length || this._activeBrushState ? this._dispatchBrushEvent(IOperateType.drawing, e) : (this._activeBrushState = !0, this._dispatchBrushEvent(IOperateType.brushActive, e)));
   }
   _moving(e) {
     const startPos = this._cacheMovePoint,
@@ -45093,9 +45209,6 @@ let Brush$1 = class Brush extends AbstractComponent {
       pos = this.eventPosToStagePos(e);
     return pos.x > maxX || pos.x < minX || pos.y > maxY || pos.y < minY;
   }
-  eventPosToStagePos(e) {
-    return this.stage.eventPointTransform(e);
-  }
   _dispatchBrushEvent(operateType, e) {
     this._dispatchEvent(operateType, {
       operateMask: this._operatingMask,
@@ -45104,7 +45217,7 @@ let Brush$1 = class Brush extends AbstractComponent {
     });
   }
   _clearMask() {
-    this._brushMaskAABBBoundsDict = {}, this._container.incrementalClearChild(), this._operatingMask = null;
+    this._brushMaskAABBBoundsDict = {}, this._container.removeAllChild(), this._operatingMask = null;
   }
   _isEmptyMask() {
     return isEmpty(this._brushMaskAABBBoundsDict) || Object.keys(this._brushMaskAABBBoundsDict).every(key => this._brushMaskAABBBoundsDict[key].empty());
@@ -58705,7 +58818,7 @@ class Compiler {
                 (_b = (_a = this._option) === null || _a === void 0 ? void 0 : _a.onError) === null || _b === void 0 ? void 0 : _b.call(_a, ...args);
             });
         }
-        const _e = this._option, { performanceHook, autoRefreshDpr, dpr, mode, gestureConfig, interactive, clickInterval, autoPreventDefault } = _e, restOption = __rest$e(_e, ["performanceHook", "autoRefreshDpr", "dpr", "mode", "gestureConfig", "interactive", "clickInterval", "autoPreventDefault"]);
+        const _e = this._option, { performanceHook, autoRefreshDpr, dpr, mode, gestureConfig, interactive, clickInterval, autoPreventDefault, beforeRender } = _e, restOption = __rest$e(_e, ["performanceHook", "autoRefreshDpr", "dpr", "mode", "gestureConfig", "interactive", "clickInterval", "autoPreventDefault", "beforeRender"]);
         this._view = new View(Object.assign(Object.assign({ width: this._width, height: this._height, container: (_c = this._container.dom) !== null && _c !== void 0 ? _c : null, renderCanvas: (_d = this._container.canvas) !== null && _d !== void 0 ? _d : null, hooks: performanceHook }, restOption), { dpr, autoRefresh: isValid$1(autoRefreshDpr) ? autoRefreshDpr : !isValid$1(dpr), mode: toRenderMode(mode), autoFit: false, eventConfig: {
                 gesture: isValid$1(gestureConfig) ? gestureConfig : isMobileLikeMode(mode),
                 disable: interactive === false,
@@ -58714,7 +58827,11 @@ class Compiler {
             }, doLayout: () => {
                 var _a;
                 (_a = this._compileChart) === null || _a === void 0 ? void 0 : _a.onLayout(this._view);
-            }, logger: logger, logLevel: logger.level() }));
+            }, logger: logger, logLevel: logger.level(), beforeRender: (stage) => {
+                var _a;
+                (_a = this._compileChart) === null || _a === void 0 ? void 0 : _a.onBeforeRender(this._view);
+                beforeRender === null || beforeRender === void 0 ? void 0 : beforeRender(stage);
+            } }));
         this._setCanvasStyle();
         this.getStage().hooks.afterRender.tap('chart-event', this.handleStageRender);
         if (interactive !== false) {
@@ -60006,6 +60123,8 @@ class BaseModel extends CompilableBase {
     }
     onEvaluateEnd(ctx) {
     }
+    onBeforeRender() {
+    }
     onDataUpdate() {
     }
     beforeRelease() {
@@ -64117,7 +64236,7 @@ const registerVChartCore = () => {
 };
 registerVChartCore();
 
-const version = "1.13.11";
+const version = "1.13.13-alpha.0";
 
 const addVChartProperty = (data, op) => {
     const context = op.beforeCall();
@@ -71044,6 +71163,10 @@ class BaseChart extends CompilableBase {
         const elements = [...this._components, ...this._regions, ...this._series];
         elements.forEach(element => element.onEvaluateEnd(option));
     }
+    onBeforeRender(view) {
+        const elements = [...this._components, ...this._regions, ...this._series];
+        elements.forEach(element => element.onBeforeRender());
+    }
     getLayoutElements() {
         return this.getAllModels()
             .map(i => i.layout)
@@ -95025,6 +95148,8 @@ class BaseCrossHair extends BaseComponent {
     }
     updateLayoutAttribute() {
         this._limitBounds = null;
+    }
+    onBeforeRender() {
         this._showDefaultCrosshair();
     }
     calculateTriggerPoint(params) {
@@ -95170,7 +95295,7 @@ class BaseCrossHair extends BaseComponent {
         }
     }
     _parseField(field, fieldName) {
-        var _a, _b;
+        var _a, _b, _c;
         const hair = {};
         const { line = {}, label = {}, visible } = field;
         hair.visible = visible;
@@ -95181,7 +95306,7 @@ class BaseCrossHair extends BaseComponent {
         else {
             const style = line.style || {};
             const { stroke, fill, lineWidth } = style;
-            const _c = style, { strokeOpacity, fillOpacity, opacity } = _c, restStyle = __rest$e(_c, ["strokeOpacity", "fillOpacity", "opacity"]);
+            const _d = style, { strokeOpacity, fillOpacity, opacity } = _d, restStyle = __rest$e(_d, ["strokeOpacity", "fillOpacity", "opacity"]);
             const isLineType = hair.type === 'line';
             let finalOpacity = isLineType ? strokeOpacity : fillOpacity;
             if (isNumber$1(opacity)) {
@@ -95209,8 +95334,9 @@ class BaseCrossHair extends BaseComponent {
         }
         if (!!label.visible) {
             const labelBackground = label.labelBackground || {};
+            const syncAxisLabelAngle = (_c = label.syncAxisLabelAngle) !== null && _c !== void 0 ? _c : false;
             const labelStyle = label.style || {};
-            const _d = labelBackground.style || {}, { fill: rectFill = 'rgba(47, 59, 82, 0.9)', stroke: rectStroke, outerBorder } = _d, rectStyle = __rest$e(_d, ["fill", "stroke", "outerBorder"]);
+            const _e = labelBackground.style || {}, { fill: rectFill = 'rgba(47, 59, 82, 0.9)', stroke: rectStroke, outerBorder } = _e, rectStyle = __rest$e(_e, ["fill", "stroke", "outerBorder"]);
             hair.label = {
                 visible: true,
                 formatMethod: label.formatMethod,
@@ -95218,6 +95344,7 @@ class BaseCrossHair extends BaseComponent {
                 minWidth: labelBackground.minWidth,
                 maxWidth: labelBackground.maxWidth,
                 padding: labelBackground.padding,
+                syncAxisLabelAngle,
                 textStyle: Object.assign(Object.assign({ fontSize: 14, pickable: false }, labelStyle), { fill: labelStyle.fill || '#fff', stroke: get$1(labelStyle, 'stroke') }),
                 panel: (isBoolean$1(labelBackground.visible) ? labelBackground.visible : !!labelBackground)
                     ? Object.assign({ visible: true, pickable: false, fill: rectFill, stroke: rectStroke, outerBorder: Object.assign({ stroke: rectFill, distance: 0, lineWidth: 3 }, outerBorder) }, rectStyle) : { visible: false },
@@ -95310,9 +95437,11 @@ const layoutByValue$1 = (stateByField, series, layoutStartPoint, enableRemain =
         layoutStartPoint = { x: 0, y: 0 };
     }
     Object.keys(stateByField).forEach(field => {
+        var _a, _b, _c, _d, _e;
         const { currentValue, cacheInfo, labelsComp, attributes, coordKey } = stateByField[field];
         let axis = null;
         let coord = 0;
+        let axisLabel = null;
         if (currentValue.size) {
             const item = Array.from(currentValue.values())[0];
             coord =
@@ -95320,6 +95449,8 @@ const layoutByValue$1 = (stateByField, series, layoutStartPoint, enableRemain =
                     item.axis.getLayoutStartPoint()[coordKey] -
                     layoutStartPoint[coordKey];
             axis = item.axis;
+            axisLabel = (_e = (_d = (_c = (_b = (_a = axis
+                .getVRenderComponents()[0]) === null || _a === void 0 ? void 0 : _a.children[0]) === null || _b === void 0 ? void 0 : _b.children[0]) === null || _c === void 0 ? void 0 : _c.getChildByName('axis-label-container')) === null || _d === void 0 ? void 0 : _d.getChildByName('axis-label-container-layer-0')) === null || _e === void 0 ? void 0 : _e.children[0];
         }
         const isVisible = !!currentValue.size && Number.isFinite(coord) && !Number.isNaN(coord);
         const useCache = enableRemain && !isVisible && isValid$1(cacheInfo);
@@ -95337,7 +95468,8 @@ const layoutByValue$1 = (stateByField, series, layoutStartPoint, enableRemain =
                     }, {})
                     : null,
                 visible: isVisible,
-                axis
+                axis,
+                axisLabel: axisLabel
             };
         if (newCacheInfo) {
             newCacheInfo._isCache = useCache;
@@ -95346,7 +95478,7 @@ const layoutByValue$1 = (stateByField, series, layoutStartPoint, enableRemain =
         let offsetSize = 0;
         if (attributes) {
             currentValue.forEach(({ axis, datum: value = '' }) => {
-                var _a;
+                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
                 let niceLabelFormatter = null;
                 const scale = axis.getScale();
                 if (isDiscrete(scale.type)) {
@@ -95375,36 +95507,37 @@ const layoutByValue$1 = (stateByField, series, layoutStartPoint, enableRemain =
                 if (newCacheInfo && ((_a = attributes.label) === null || _a === void 0 ? void 0 : _a.visible) && !useCache) {
                     const labelOffset = getAxisLabelOffset(axis.getSpec());
                     const axisOrient = axis.getOrient();
+                    const syncAxisLabelAngle = (_b = attributes.label) === null || _b === void 0 ? void 0 : _b.syncAxisLabelAngle;
                     if (newCacheInfo.labels[axisOrient]) {
                         newCacheInfo.labels[axisOrient].visible = true;
                         newCacheInfo.labels[axisOrient].text = value;
                         if (axisOrient === 'left') {
                             newCacheInfo.labels[axisOrient].dx = -labelOffset;
                             newCacheInfo.labelsTextStyle[axisOrient] = {
-                                textAlign: 'right',
-                                textBaseline: 'middle'
+                                textAlign: syncAxisLabelAngle && axisLabel ? ((_c = axisLabel.attribute.textAlign) !== null && _c !== void 0 ? _c : 'right') : 'right',
+                                textBaseline: syncAxisLabelAngle && axisLabel ? ((_d = axisLabel.attribute.textBaseline) !== null && _d !== void 0 ? _d : 'middle') : 'middle'
                             };
                         }
                         else if (axisOrient === 'right') {
                             newCacheInfo.labels[axisOrient].dx = labelOffset;
                             newCacheInfo.labelsTextStyle[axisOrient] = {
-                                textAlign: 'left',
-                                textBaseline: 'middle'
+                                textAlign: syncAxisLabelAngle && axisLabel ? ((_e = axisLabel.attribute.textAlign) !== null && _e !== void 0 ? _e : 'left') : 'left',
+                                textBaseline: syncAxisLabelAngle && axisLabel ? ((_f = axisLabel.attribute.textBaseline) !== null && _f !== void 0 ? _f : 'middle') : 'middle'
                             };
                         }
                         else if (axisOrient === 'top') {
                             newCacheInfo.labels[axisOrient].y = 0;
                             newCacheInfo.labels[axisOrient].dy = -labelOffset;
                             newCacheInfo.labelsTextStyle[axisOrient] = {
-                                textAlign: 'center',
-                                textBaseline: 'bottom'
+                                textAlign: syncAxisLabelAngle && axisLabel ? ((_g = axisLabel.attribute.textAlign) !== null && _g !== void 0 ? _g : 'center') : 'center',
+                                textBaseline: syncAxisLabelAngle && axisLabel ? ((_h = axisLabel.attribute.textBaseline) !== null && _h !== void 0 ? _h : 'bottom') : 'bottom'
                             };
                         }
                         else if (axisOrient === 'bottom') {
                             newCacheInfo.labels[axisOrient].dy = labelOffset;
                             newCacheInfo.labelsTextStyle[axisOrient] = {
-                                textAlign: 'center',
-                                textBaseline: 'top'
+                                textAlign: syncAxisLabelAngle && axisLabel ? ((_j = axisLabel.attribute.textAlign) !== null && _j !== void 0 ? _j : 'center') : 'center',
+                                textBaseline: syncAxisLabelAngle && axisLabel ? ((_k = axisLabel.attribute.textBaseline) !== null && _k !== void 0 ? _k : 'top') : 'top'
                             };
                         }
                         newCacheInfo.labels[axisOrient].defaultFormatter = niceLabelFormatter;
@@ -95648,9 +95781,9 @@ class CartesianCrossHair extends BaseCrossHair {
             const positionAttribute = layoutCrosshair$1(this._stateByField[field]);
             this._updateCrosshairByField(field, positionAttribute);
             Object.keys(labels).forEach(labelKey => {
-                var _a;
+                var _a, _b, _c;
                 if (labels[labelKey].visible) {
-                    const updateAttrs = Object.assign(Object.assign(Object.assign({ [coordKey]: coord + bandSize / 2 }, labels[labelKey]), attributes.label), { textStyle: Object.assign(Object.assign({}, (_a = attributes.label) === null || _a === void 0 ? void 0 : _a.textStyle), labelsTextStyle[labelKey]), zIndex: this.labelZIndex, visible: true });
+                    const updateAttrs = Object.assign(Object.assign(Object.assign({ [coordKey]: coord + bandSize / 2 }, labels[labelKey]), attributes.label), { angle: attributes.label.syncAxisLabelAngle ? ((_b = (_a = cacheInfo.axisLabel) === null || _a === void 0 ? void 0 : _a.attribute.angle) !== null && _b !== void 0 ? _b : 0) : 0, textStyle: Object.assign(Object.assign({}, (_c = attributes.label) === null || _c === void 0 ? void 0 : _c.textStyle), labelsTextStyle[labelKey]), zIndex: this.labelZIndex, visible: true });
                     this._updateCrosshairLabel(labelsComp[labelKey], updateAttrs, label => {
                         label.name = `crosshair-${field.replace('Field', '')}-${labelKey}-label`;
                         labelsComp[labelKey] = label;
@@ -97656,7 +97789,9 @@ function getXValue(datum, xDomain, autoRange, refSeries, regionWidth, regionStar
         x = convertPercentToValue(datum.x, regionWidth) + regionStartLayoutStartPoint.x;
     }
     else {
-        x = relativeSeries.getXAxisHelper().dataToPosition([datum.x]) + regionStartLayoutStartPoint.x;
+        x =
+            convertDatumToValue(relativeSeries.getXAxisHelper(), [datum.x]) +
+                regionStartLayoutStartPoint.x;
     }
     return x;
 }
@@ -97671,7 +97806,9 @@ function getYValue(datum, yDomain, autoRange, refSeries, regionHeight, regionSta
         y = convertPercentToValue(datum.y, regionHeight) + regionStartLayoutStartPoint.y;
     }
     else {
-        y = relativeSeries.getYAxisHelper().dataToPosition([datum.y]) + regionStartLayoutStartPoint.y;
+        y =
+            convertDatumToValue(relativeSeries.getYAxisHelper(), [datum.y]) +
+                regionStartLayoutStartPoint.y;
     }
     return y;
 }
@@ -97681,7 +97818,7 @@ function getAngleValue(datum, angleDomain, autoRange, refSeries) {
     isNumber$1(datum.angle) &&
         isNeedExtendDomain(angleDomain, datum.angle, autoRange) &&
         ((_b = (_a = relativeSeries.angleAxisHelper) === null || _a === void 0 ? void 0 : _a.setExtendDomain) === null || _b === void 0 ? void 0 : _b.call(_a, 'marker_angleAxis_extend', datum.angle));
-    return relativeSeries.angleAxisHelper.dataToPosition([datum.angle]);
+    return convertDatumToValue(relativeSeries.angleAxisHelper, [datum.angle]);
 }
 function getRadiusValue(datum, radiusDomain, autoRange, refSeries) {
     var _a, _b;
@@ -97689,11 +97826,18 @@ function getRadiusValue(datum, radiusDomain, autoRange, refSeries) {
     isNumber$1(datum.radius) &&
         isNeedExtendDomain(radiusDomain, datum.radius, autoRange) &&
         ((_b = (_a = relativeSeries.radiusAxisHelper) === null || _a === void 0 ? void 0 : _a.setExtendDomain) === null || _b === void 0 ? void 0 : _b.call(_a, 'marker_radiusAxis_extend', datum.radius));
-    return relativeSeries.radiusAxisHelper.dataToPosition([datum.radius]);
+    return convertDatumToValue(relativeSeries.radiusAxisHelper, [datum.radius]);
 }
 function convertPercentToValue(percent, relativeLength) {
     return (Number(percent.substring(0, percent.length - 1)) * relativeLength) / 100;
 }
+function convertDatumToValue(axisHelper, datum) {
+    const scale = axisHelper.getScale(0);
+    if (isContinuous(scale.type) && scale.domain()[0] === scale.domain()[1] && datum[0] !== scale.domain()[0]) {
+        return NaN;
+    }
+    return axisHelper.dataToPosition(datum);
+}
 function isAggrSpec(spec) {
     return AGGR_TYPE.includes(spec);
 }
@@ -97858,8 +98002,8 @@ function cartesianCoordinateLayout(data, relativeSeries, autoRange, coordinatesO
             isNeedExtendDomain(yDomain, yValue[0], autoRange) &&
             ((_d = (_c = refRelativeSeries.getYAxisHelper()) === null || _c === void 0 ? void 0 : _c.setExtendDomain) === null || _d === void 0 ? void 0 : _d.call(_c, 'marker_yAxis_extend', yValue[0]));
         points.push({
-            x: refRelativeSeries.getXAxisHelper().dataToPosition(xValue) + regionStartLayoutStartPoint.x + offsetX,
-            y: refRelativeSeries.getYAxisHelper().dataToPosition(yValue) + regionStartLayoutStartPoint.y + offsetY
+            x: convertDatumToValue(refRelativeSeries.getXAxisHelper(), xValue) + regionStartLayoutStartPoint.x + offsetX,
+            y: convertDatumToValue(refRelativeSeries.getYAxisHelper(), yValue) + regionStartLayoutStartPoint.y + offsetY
         });
     });
     return points;
@@ -97883,8 +98027,8 @@ function polarCoordinateLayout(data, relativeSeries, autoRange) {
             isNeedExtendDomain(radiusDomain, radiusValue[0], autoRange) &&
             ((_d = (_c = refRelativeSeries.radiusAxisHelper) === null || _c === void 0 ? void 0 : _c.setExtendDomain) === null || _d === void 0 ? void 0 : _d.call(_c, 'marker_yAxis_extend', radiusValue[0]));
         points.push({
-            angle: refRelativeSeries.angleAxisHelper.dataToPosition(angleValue),
-            radius: refRelativeSeries.radiusAxisHelper.dataToPosition(radiusValue)
+            angle: convertDatumToValue(refRelativeSeries.angleAxisHelper, angleValue),
+            radius: convertDatumToValue(refRelativeSeries.radiusAxisHelper, radiusValue)
         });
     });
     return points;
@@ -100638,7 +100782,6 @@ class Brush extends BaseComponent {
         this._linkedInBrushElementsMap = {};
         this._linkedOutOfBrushElementsMap = {};
         this._cacheInteractiveRangeAttrs = [];
-        this._needDisablePickable = false;
         this._releatedAxes = [];
         this._regionAxisMap = {};
         this._axisDataZoomMap = {};
@@ -100794,34 +100937,36 @@ class Brush extends BaseComponent {
             this._emitEvent(ChartEvent.brushActive, region);
         });
         brush.addEventListener(IOperateType.drawStart, (e) => {
+            this._setRegionMarkPickable(region, true);
             this._emitEvent(ChartEvent.brushStart, region);
         });
         brush.addEventListener(IOperateType.moveStart, (e) => {
+            this._setRegionMarkPickable(region, true);
             this._emitEvent(ChartEvent.brushStart, region);
         });
         brush.addEventListener(IOperateType.drawing, (e) => {
-            this._needDisablePickable = true;
+            this._setRegionMarkPickable(region, false);
             this._handleBrushChange(region, e);
             this._emitEvent(ChartEvent.brushChange, region);
         });
         brush.addEventListener(IOperateType.moving, (e) => {
+            this._setRegionMarkPickable(region, false);
             this._handleBrushChange(region, e);
             this._emitEvent(ChartEvent.brushChange, region);
         });
         brush.addEventListener(IOperateType.brushClear, (e) => {
+            this._setRegionMarkPickable(region, true);
             this._initMarkBrushState(componentIndex, '');
-            this._needDisablePickable = false;
             this._emitEvent(ChartEvent.brushClear, region);
         });
         brush.addEventListener(IOperateType.drawEnd, (e) => {
             var _a;
-            this._needDisablePickable = false;
+            this._setRegionMarkPickable(region, true);
             const { operateMask } = e.detail;
             if ((_a = this._spec) === null || _a === void 0 ? void 0 : _a.onBrushEnd) {
                 if (this._spec.onBrushEnd(e) === true) {
                     this.clearGraphic();
                     this._initMarkBrushState(componentIndex, '');
-                    this._needDisablePickable = false;
                     this._emitEvent(ChartEvent.brushClear, region);
                 }
                 else {
@@ -100838,6 +100983,7 @@ class Brush extends BaseComponent {
             }
         });
         brush.addEventListener(IOperateType.moveEnd, (e) => {
+            this._setRegionMarkPickable(region, true);
             const { operateMask } = e.detail;
             const inBrushData = this._extendDataInBrush(this._inBrushElementsMap);
             if (!this._spec.zoomWhenEmpty && inBrushData.length > 0) {
@@ -100965,7 +101111,6 @@ class Brush extends BaseComponent {
                     this._outOfBrushElementsMap[elementKey] = el;
                     delete this._inBrushElementsMap[operateMask.name][elementKey];
                 }
-                graphicItem.setAttribute('pickable', !this._needDisablePickable);
             });
         });
     }
@@ -101024,7 +101169,6 @@ class Brush extends BaseComponent {
                             el.addState(OUT_BRUSH_STATE);
                             this._linkedOutOfBrushElementsMap[elementKey] = el;
                         }
-                        graphicItem.setAttribute('pickable', !this._needDisablePickable);
                     });
                 });
             }
@@ -101106,6 +101250,12 @@ class Brush extends BaseComponent {
             });
         });
     }
+    _setRegionMarkPickable(region, pickable) {
+        region
+            .getGroupMark()
+            .getProduct()
+            .elements.forEach(el => el.getGraphicItem().setAttribute('childrenPickable', pickable));
+    }
     _stateClamp(state) {
         return Math.min(Math.max(0, state), 1);
     }
@@ -101185,7 +101335,6 @@ class Brush extends BaseComponent {
             const container = this.getContainer();
             this._brushComponents.forEach((brush, index) => {
                 this._initMarkBrushState(index, '');
-                this._needDisablePickable = false;
                 brush.removeAllChild();
                 brush.releaseBrushEvents();
                 if (container) {