@visactor/vchart 1.1.0-beta.9 → 1.1.0

package/build/index.js

@@ -1662,6 +1662,9 @@
 	!function (InnerBBox) {
 	  InnerBBox[InnerBBox.NONE = 0] = "NONE", InnerBBox[InnerBBox.BBOX1 = 1] = "BBOX1", InnerBBox[InnerBBox.BBOX2 = 2] = "BBOX2";
 	}(InnerBBox || (InnerBBox = {}));
+	function rectInsideAnotherRect(bbox1, bbox2, format) {
+	  return bbox1 && bbox2 ? (x11 = bbox1.x1, x12 = bbox1.x2, y11 = bbox1.y1, y12 = bbox1.y2, x21 = bbox2.x1, x22 = bbox2.x2, y21 = bbox2.y1, y22 = bbox2.y2, format && (x11 > x12 && ([x11, x12] = [x12, x11]), y11 > y12 && ([y11, y12] = [y12, y11]), x21 > x22 && ([x21, x22] = [x22, x21]), y21 > y22 && ([y21, y22] = [y22, y21])), x11 > x21 && x12 < x22 && y11 > y21 && y12 < y22 ? InnerBBox.BBOX1 : x21 > x11 && x22 < x12 && y21 > y11 && y22 < y12 ? InnerBBox.BBOX2 : InnerBBox.NONE) : InnerBBox.NONE;
+	}
 	function isRectIntersect(bbox1, bbox2, format) {
 	  return !bbox1 || !bbox2 || (format ? (x11 = bbox1.x1, x12 = bbox1.x2, y11 = bbox1.y1, y12 = bbox1.y2, x21 = bbox2.x1, x22 = bbox2.x2, y21 = bbox2.y1, y22 = bbox2.y2, x11 > x12 && ([x11, x12] = [x12, x11]), y11 > y12 && ([y11, y12] = [y12, y11]), x21 > x22 && ([x21, x22] = [x22, x21]), y21 > y22 && ([y21, y22] = [y22, y21]), !(x11 > x22 || x12 < x21 || y11 > y22 || y12 < y21)) : !(bbox1.x1 > bbox2.x2 || bbox1.x2 < bbox2.x1 || bbox1.y1 > bbox2.y2 || bbox1.y2 < bbox2.y1));
 	}
@@ -2608,6 +2611,7 @@
 	    ComponentTypeEnum["scrollBar"] = "scrollBar";
 	    ComponentTypeEnum["label"] = "label";
 	    ComponentTypeEnum["brush"] = "brush";
+	    ComponentTypeEnum["poptip"] = "poptip";
 	    ComponentTypeEnum["customMark"] = "customMark";
 	})(ComponentTypeEnum || (ComponentTypeEnum = {}));
 
@@ -15558,7 +15562,7 @@
 	const EnvContribution = Symbol.for("EnvContribution");
 	const Global = Symbol.for("Global");
 
-	var __decorate$1I = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1K = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -15683,7 +15687,7 @@
 	    return this._env || this.setEnv("browser"), this.envContribution.loadBlob(url);
 	  }
 	};
-	DefaultGlobal = __decorate$1I([injectable(), __param$S(0, inject(ContributionProvider)), __param$S(0, named(EnvContribution)), __metadata$15("design:paramtypes", [Object])], DefaultGlobal);
+	DefaultGlobal = __decorate$1K([injectable(), __param$S(0, inject(ContributionProvider)), __param$S(0, named(EnvContribution)), __metadata$15("design:paramtypes", [Object])], DefaultGlobal);
 
 	const circleThreshold = tau$1 - 1e-8;
 	class BoundsContext {
@@ -16952,7 +16956,7 @@
 	  opacity: 1
 	});
 
-	var __decorate$1H = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1J = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -17064,9 +17068,9 @@
 	    return data.str += suffix, data.width += suffixWidth, data;
 	  }
 	};
-	ATextMeasure = __decorate$1H([injectable()], ATextMeasure);
+	ATextMeasure = __decorate$1J([injectable()], ATextMeasure);
 
-	var __decorate$1G = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1I = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -17075,7 +17079,7 @@
 	};
 	const TextMeasureContribution = Symbol.for("TextMeasureContribution");
 	let DefaultTextMeasureContribution = class extends ATextMeasure {};
-	DefaultTextMeasureContribution = __decorate$1G([injectable()], DefaultTextMeasureContribution);
+	DefaultTextMeasureContribution = __decorate$1I([injectable()], DefaultTextMeasureContribution);
 
 	const container = new Container();
 
@@ -17447,7 +17451,7 @@
 	  return containPath(commands, lineWidth, !0, x, y);
 	}
 
-	var __decorate$1F = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1H = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -17510,7 +17514,7 @@
 	    }, null != option ? option : {}), textSpec);
 	  }
 	};
-	DefaultGraphicUtil = __decorate$1F([injectable(), __param$R(0, inject(ContributionProvider)), __param$R(0, named(TextMeasureContribution)), __param$R(1, inject(Global)), __metadata$14("design:paramtypes", [Object, Object])], DefaultGraphicUtil);
+	DefaultGraphicUtil = __decorate$1H([injectable(), __param$R(0, inject(ContributionProvider)), __param$R(0, named(TextMeasureContribution)), __param$R(1, inject(Global)), __metadata$14("design:paramtypes", [Object, Object])], DefaultGraphicUtil);
 	var TransformMode;
 	!function (TransformMode) {
 	  TransformMode[TransformMode.transform = 0] = "transform", TransformMode[TransformMode.matrix = 1] = "matrix";
@@ -17554,7 +17558,7 @@
 	    return this;
 	  }
 	};
-	DefaultTransformUtil = __decorate$1F([injectable(), __metadata$14("design:paramtypes", [])], DefaultTransformUtil);
+	DefaultTransformUtil = __decorate$1H([injectable(), __metadata$14("design:paramtypes", [])], DefaultTransformUtil);
 
 	const defaultThemeObj = {
 	    arc: DefaultArcAttribute,
@@ -22109,7 +22113,7 @@
 	  }
 	}
 
-	var __decorate$1E = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1G = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -22157,9 +22161,9 @@
 	    return "browser" === this.global.env ? 10 : 0;
 	  }
 	};
-	DefaultLayerService = __decorate$1E([injectable(), __param$Q(0, inject(Global)), __metadata$13("design:paramtypes", [Object])], DefaultLayerService);
+	DefaultLayerService = __decorate$1G([injectable(), __param$Q(0, inject(Global)), __metadata$13("design:paramtypes", [Object])], DefaultLayerService);
 
-	var __decorate$1D = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1F = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -22263,7 +22267,7 @@
 	    this._handler.clearViewBox(viewBox, color);
 	  }
 	};
-	__decorate$1D([postConstruct(), __metadata$12("design:type", Function), __metadata$12("design:paramtypes", []), __metadata$12("design:returntype", void 0)], DefaultWindow.prototype, "postInit", null), DefaultWindow = __decorate$1D([injectable(), __param$P(0, inject(Global)), __metadata$12("design:paramtypes", [Object])], DefaultWindow);
+	__decorate$1F([postConstruct(), __metadata$12("design:type", Function), __metadata$12("design:paramtypes", []), __metadata$12("design:returntype", void 0)], DefaultWindow.prototype, "postInit", null), DefaultWindow = __decorate$1F([injectable(), __param$P(0, inject(Global)), __metadata$12("design:paramtypes", [Object])], DefaultWindow);
 
 	const TransformUtil = Symbol.for("TransformUtil");
 	const GraphicUtil = Symbol.for("GraphicUtil");
@@ -22558,7 +22562,7 @@
 	const TextRenderContribution = Symbol.for("TextRenderContribution");
 	const InteractiveSubRenderContribution = Symbol.for("InteractiveSubRenderContribution");
 
-	var __decorate$1C = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1E = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -22770,9 +22774,9 @@
 	    drawPathProxy(arc, context, x, y, drawContext, params) || this.drawShape(arc, context, x, y, drawContext, params), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasArcRender = __decorate$1C([injectable(), __param$O(0, inject(ContributionProvider)), __param$O(0, named(ArcRenderContribution)), __metadata$11("design:paramtypes", [Object])], DefaultCanvasArcRender);
+	DefaultCanvasArcRender = __decorate$1E([injectable(), __param$O(0, inject(ContributionProvider)), __param$O(0, named(ArcRenderContribution)), __metadata$11("design:paramtypes", [Object])], DefaultCanvasArcRender);
 
-	var __decorate$1B = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1D = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -22836,7 +22840,7 @@
 	    drawPathProxy(circle, context, x, y, drawContext, params) || this.drawShape(circle, context, x, y, drawContext, params), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasCircleRender = __decorate$1B([injectable(), __param$N(0, inject(ContributionProvider)), __param$N(0, named(CircleRenderContribution)), __metadata$10("design:paramtypes", [Object])], DefaultCanvasCircleRender);
+	DefaultCanvasCircleRender = __decorate$1D([injectable(), __param$N(0, inject(ContributionProvider)), __param$N(0, named(CircleRenderContribution)), __metadata$10("design:paramtypes", [Object])], DefaultCanvasCircleRender);
 
 	const CIRCLE_UPDATE_TAG_KEY = ["radius", "startAngle", "endAngle", ...GRAPHIC_UPDATE_TAG_KEY];
 	class Circle extends Graphic {
@@ -25161,7 +25165,7 @@
 	  }
 	}
 
-	var __decorate$1A = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1C = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25185,9 +25189,9 @@
 	    return aabbBounds;
 	  }
 	};
-	DefaultOuterBorderBoundsContribution = __decorate$1A([injectable()], DefaultOuterBorderBoundsContribution);
+	DefaultOuterBorderBoundsContribution = __decorate$1C([injectable()], DefaultOuterBorderBoundsContribution);
 
-	var __decorate$1z = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1B = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25196,9 +25200,9 @@
 	};
 	const RectBoundsContribution = Symbol.for("RectBoundsContribution");
 	let DefaultRectOuterBorderBoundsContribution = class extends DefaultOuterBorderBoundsContribution {};
-	DefaultRectOuterBorderBoundsContribution = __decorate$1z([injectable()], DefaultRectOuterBorderBoundsContribution);
+	DefaultRectOuterBorderBoundsContribution = __decorate$1B([injectable()], DefaultRectOuterBorderBoundsContribution);
 
-	var __decorate$1y = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1A = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25224,9 +25228,9 @@
 	    return aabbBounds;
 	  }
 	};
-	DefaultSymbolOuterBorderBoundsContribution = __decorate$1y([injectable()], DefaultSymbolOuterBorderBoundsContribution);
+	DefaultSymbolOuterBorderBoundsContribution = __decorate$1A([injectable()], DefaultSymbolOuterBorderBoundsContribution);
 
-	var __decorate$1x = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1z = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25235,9 +25239,9 @@
 	};
 	const CircleBoundsContribution = Symbol.for("CircleBoundsContribution");
 	let DefaultCircleOuterBorderBoundsContribution = class extends DefaultOuterBorderBoundsContribution {};
-	DefaultCircleOuterBorderBoundsContribution = __decorate$1x([injectable()], DefaultCircleOuterBorderBoundsContribution);
+	DefaultCircleOuterBorderBoundsContribution = __decorate$1z([injectable()], DefaultCircleOuterBorderBoundsContribution);
 
-	var __decorate$1w = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1y = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25246,9 +25250,9 @@
 	};
 	const ArcBoundsContribution = Symbol.for("ArcBoundsContribution");
 	let DefaultArcOuterBorderBoundsContribution = class extends DefaultOuterBorderBoundsContribution {};
-	DefaultArcOuterBorderBoundsContribution = __decorate$1w([injectable()], DefaultArcOuterBorderBoundsContribution);
+	DefaultArcOuterBorderBoundsContribution = __decorate$1y([injectable()], DefaultArcOuterBorderBoundsContribution);
 
-	var __decorate$1v = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1x = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25257,7 +25261,7 @@
 	};
 	const PathBoundsContribution = Symbol.for("PathBoundsContribution");
 	let DefaultPathOuterBorderBoundsContribution = class extends DefaultOuterBorderBoundsContribution {};
-	DefaultPathOuterBorderBoundsContribution = __decorate$1v([injectable()], DefaultPathOuterBorderBoundsContribution);
+	DefaultPathOuterBorderBoundsContribution = __decorate$1x([injectable()], DefaultPathOuterBorderBoundsContribution);
 
 	function createMat4() {
 	  return [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1];
@@ -25317,7 +25321,7 @@
 	const matrixAllocate = new DefaultMatrixAllocate();
 	const mat4Allocate = new DefaultMat4Allocate();
 
-	var __decorate$1u = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1w = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -25849,7 +25853,7 @@
 	    this.combindShadowAABBBounds(aabbBounds, graphic), transformBoundsWithMatrix(aabbBounds, aabbBounds, graphic.transMatrix);
 	  }
 	};
-	DefaultGraphicService = __decorate$1u([injectable(), __param$M(0, inject(GraphicCreator)), __param$M(1, inject(ContributionProvider)), __param$M(1, named(RectBoundsContribution)), __param$M(2, inject(ContributionProvider)), __param$M(2, named(SymbolBoundsContribution)), __param$M(3, inject(ContributionProvider)), __param$M(3, named(CircleBoundsContribution)), __param$M(4, inject(ContributionProvider)), __param$M(4, named(ArcBoundsContribution)), __param$M(5, inject(ContributionProvider)), __param$M(5, named(PathBoundsContribution)), __metadata$$("design:paramtypes", [Object, Object, Object, Object, Object, Object])], DefaultGraphicService);
+	DefaultGraphicService = __decorate$1w([injectable(), __param$M(0, inject(GraphicCreator)), __param$M(1, inject(ContributionProvider)), __param$M(1, named(RectBoundsContribution)), __param$M(2, inject(ContributionProvider)), __param$M(2, named(SymbolBoundsContribution)), __param$M(3, inject(ContributionProvider)), __param$M(3, named(CircleBoundsContribution)), __param$M(4, inject(ContributionProvider)), __param$M(4, named(ArcBoundsContribution)), __param$M(5, inject(ContributionProvider)), __param$M(5, named(PathBoundsContribution)), __metadata$$("design:paramtypes", [Object, Object, Object, Object, Object, Object])], DefaultGraphicService);
 
 	class ShadowRoot extends Group$1 {
 	  constructor(graphic) {
@@ -26069,7 +26073,7 @@
 	}
 	createRichText({});
 
-	var __decorate$1t = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1v = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -26153,7 +26157,7 @@
 	    context.translate(p.x, p.y, !1), context.scale(scaleX, scaleY, !1), context.rotate(angle, !1), context.translate(-p.x, -p.y, !1), context.setTransformForCurrent();
 	  }
 	};
-	BaseRender = __decorate$1t([injectable()], BaseRender);
+	BaseRender = __decorate$1v([injectable()], BaseRender);
 
 	function drawSegments(path, segPath, percent, clipRangeByDimension, params) {
 	  const {
@@ -26230,7 +26234,7 @@
 	  }
 	}
 
-	var __decorate$1s = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1u = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -26336,7 +26340,7 @@
 	    } else this.drawSegmentItem(context, line.cache, !!fill, !!stroke, fillOpacity, strokeOpacity, line.attribute, lineAttribute, clipRange, clipRangeByDimension, x, y, line, fillCb, strokeCb);
 	  }
 	};
-	DefaultCanvasLineRender = __decorate$1s([injectable()], DefaultCanvasLineRender);
+	DefaultCanvasLineRender = __decorate$1u([injectable()], DefaultCanvasLineRender);
 
 	function drawAreaSegments(path, segPath, percent, params) {
 	  var _a;
@@ -26414,7 +26418,7 @@
 	  }
 	}
 
-	var __decorate$1r = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1t = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -26600,9 +26604,9 @@
 	    }), !1;
 	  }
 	};
-	DefaultCanvasAreaRender = __decorate$1r([injectable(), __param$L(0, inject(ContributionProvider)), __param$L(0, named(AreaRenderContribution)), __metadata$_("design:paramtypes", [Object])], DefaultCanvasAreaRender);
+	DefaultCanvasAreaRender = __decorate$1t([injectable(), __param$L(0, inject(ContributionProvider)), __param$L(0, named(AreaRenderContribution)), __metadata$_("design:paramtypes", [Object])], DefaultCanvasAreaRender);
 
-	var __decorate$1q = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1s = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -26670,7 +26674,7 @@
 	    this.z = z, drawPathProxy(path, context, x, y, drawContext, params) || (this.drawShape(path, context, x, y, drawContext, params), this.z = 0, context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasPathRender = __decorate$1q([injectable(), __param$K(0, inject(ContributionProvider)), __param$K(0, named(PathRenderContribution)), __metadata$Z("design:paramtypes", [Object])], DefaultCanvasPathRender);
+	DefaultCanvasPathRender = __decorate$1s([injectable(), __param$K(0, inject(ContributionProvider)), __param$K(0, named(PathRenderContribution)), __metadata$Z("design:paramtypes", [Object])], DefaultCanvasPathRender);
 
 	const halfPi = pi$1 / 2;
 	function createRectPath(path, x, y, width, height, rectCornerRadius) {
@@ -26727,7 +26731,7 @@
 	  return path.closePath(), path;
 	}
 
-	var __decorate$1p = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1r = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -26799,9 +26803,9 @@
 	    drawPathProxy(rect, context, x, y, drawContext, params) || this.drawShape(rect, context, x, y, drawContext, params), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasRectRender = __decorate$1p([injectable(), __param$J(0, inject(ContributionProvider)), __param$J(0, named(RectRenderContribution)), __metadata$Y("design:paramtypes", [Object])], DefaultCanvasRectRender);
+	DefaultCanvasRectRender = __decorate$1r([injectable(), __param$J(0, inject(ContributionProvider)), __param$J(0, named(RectRenderContribution)), __metadata$Y("design:paramtypes", [Object])], DefaultCanvasRectRender);
 
-	var __decorate$1o = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1q = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -26879,9 +26883,9 @@
 	    this.z = z, drawPathProxy(symbol, context, x, y, drawContext, params) || (this.drawShape(symbol, context, x, y, drawContext, params), this.z = 0, context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasSymbolRender = __decorate$1o([injectable(), __param$I(0, inject(ContributionProvider)), __param$I(0, named(SymbolRenderContribution)), __metadata$X("design:paramtypes", [Object])], DefaultCanvasSymbolRender);
+	DefaultCanvasSymbolRender = __decorate$1q([injectable(), __param$I(0, inject(ContributionProvider)), __param$I(0, named(SymbolRenderContribution)), __metadata$X("design:paramtypes", [Object])], DefaultCanvasSymbolRender);
 
-	var __decorate$1n = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1p = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27042,9 +27046,9 @@
 	    }
 	  }
 	};
-	DefaultCanvasTextRender = __decorate$1n([injectable(), __param$H(0, inject(ContributionProvider)), __param$H(0, named(TextRenderContribution)), __metadata$W("design:paramtypes", [Object])], DefaultCanvasTextRender);
+	DefaultCanvasTextRender = __decorate$1p([injectable(), __param$H(0, inject(ContributionProvider)), __param$H(0, named(TextRenderContribution)), __metadata$W("design:paramtypes", [Object])], DefaultCanvasTextRender);
 
-	var __decorate$1m = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1o = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27052,7 +27056,7 @@
 	  return c > 3 && r && Object.defineProperty(target, key, r), r;
 	};
 	let AbstractGraphicRender = class {};
-	AbstractGraphicRender = __decorate$1m([injectable()], AbstractGraphicRender);
+	AbstractGraphicRender = __decorate$1o([injectable()], AbstractGraphicRender);
 
 	function drawPolygon(path, points, x, y) {
 	  path.moveTo(points[0].x + x, points[0].y + y);
@@ -27099,7 +27103,7 @@
 	  };
 	}
 
-	var __decorate$1l = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1n = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27162,9 +27166,9 @@
 	    drawPathProxy(polygon, context, x, y, drawContext, params) || this.drawShape(polygon, context, x, y, drawContext, params), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasPolygonRender = __decorate$1l([injectable(), __param$G(0, inject(ContributionProvider)), __param$G(0, named(PolygonRenderContribution)), __metadata$V("design:paramtypes", [Object])], DefaultCanvasPolygonRender);
+	DefaultCanvasPolygonRender = __decorate$1n([injectable(), __param$G(0, inject(ContributionProvider)), __param$G(0, named(PolygonRenderContribution)), __metadata$V("design:paramtypes", [Object])], DefaultCanvasPolygonRender);
 
-	var __decorate$1k = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1m = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27241,7 +27245,7 @@
 	    }
 	  }
 	};
-	DefaultCanvasImageRender = __decorate$1k([injectable(), __param$F(0, inject(ContributionProvider)), __param$F(0, named(ImageRenderContribution)), __metadata$U("design:paramtypes", [Object])], DefaultCanvasImageRender);
+	DefaultCanvasImageRender = __decorate$1m([injectable(), __param$F(0, inject(ContributionProvider)), __param$F(0, named(ImageRenderContribution)), __metadata$U("design:paramtypes", [Object])], DefaultCanvasImageRender);
 
 	const IncrementalDrawContribution = Symbol.for("IncrementalDrawContribution");
 	const ArcRender = Symbol.for("ArcRender");
@@ -27389,7 +27393,7 @@
 	}
 	const canvasAllocate = new DefaultCanvasAllocate();
 
-	var __decorate$1j = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1l = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27429,7 +27433,7 @@
 	    } else context.highPerformanceSave(), context.setCommonStyle(graphic, graphic.attribute, x, y, graphicAttribute), context.fillStyle = background, context.fill(), context.highPerformanceRestore();
 	  }
 	};
-	DefaultBaseBackgroundRenderContribution = __decorate$1j([injectable()], DefaultBaseBackgroundRenderContribution);
+	DefaultBaseBackgroundRenderContribution = __decorate$1l([injectable()], DefaultBaseBackgroundRenderContribution);
 	let DefaultBaseInteractiveRenderContribution = class {
 	  constructor(subRenderContribitions) {
 	    this.subRenderContribitions = subRenderContribitions, this.time = BaseRenderContributionTime.afterFillStroke, this.useStyle = !0, this.order = 0;
@@ -27440,7 +27444,7 @@
 	    });
 	  }
 	};
-	DefaultBaseInteractiveRenderContribution = __decorate$1j([injectable(), __param$E(0, inject(ContributionProvider)), __param$E(0, named(InteractiveSubRenderContribution)), __metadata$T("design:paramtypes", [Object])], DefaultBaseInteractiveRenderContribution);
+	DefaultBaseInteractiveRenderContribution = __decorate$1l([injectable(), __param$E(0, inject(ContributionProvider)), __param$E(0, named(InteractiveSubRenderContribution)), __metadata$T("design:paramtypes", [Object])], DefaultBaseInteractiveRenderContribution);
 	let DefaultBaseTextureRenderContribution = class {
 	  constructor() {
 	    this.time = BaseRenderContributionTime.afterFillStroke, this.useStyle = !0, this.order = 10;
@@ -27553,9 +27557,9 @@
 	    pattern && (context.highPerformanceSave(), context.setCommonStyle(graphic, graphic.attribute, x, y, graphicAttribute), context.fillStyle = pattern, context.fill(), context.highPerformanceRestore());
 	  }
 	};
-	DefaultBaseTextureRenderContribution = __decorate$1j([injectable()], DefaultBaseTextureRenderContribution);
+	DefaultBaseTextureRenderContribution = __decorate$1l([injectable()], DefaultBaseTextureRenderContribution);
 
-	var __decorate$1i = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1k = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27616,21 +27620,21 @@
 	    });
 	  }
 	};
-	DefaultArcRenderContribution = __decorate$1i([injectable()], DefaultArcRenderContribution);
+	DefaultArcRenderContribution = __decorate$1k([injectable()], DefaultArcRenderContribution);
 	let DefaultArcBackgroundRenderContribution = class extends DefaultBaseBackgroundRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
 	  }
 	};
-	DefaultArcBackgroundRenderContribution = __decorate$1i([injectable()], DefaultArcBackgroundRenderContribution);
+	DefaultArcBackgroundRenderContribution = __decorate$1k([injectable()], DefaultArcBackgroundRenderContribution);
 	let DefaultArcTextureRenderContribution = class extends DefaultBaseTextureRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke;
 	  }
 	};
-	DefaultArcTextureRenderContribution = __decorate$1i([injectable()], DefaultArcTextureRenderContribution);
+	DefaultArcTextureRenderContribution = __decorate$1k([injectable()], DefaultArcTextureRenderContribution);
 
-	var __decorate$1h = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1j = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27672,21 +27676,21 @@
 	    }
 	  }
 	};
-	DefaultCircleRenderContribution = __decorate$1h([injectable()], DefaultCircleRenderContribution);
+	DefaultCircleRenderContribution = __decorate$1j([injectable()], DefaultCircleRenderContribution);
 	let DefaultCircleBackgroundRenderContribution = class extends DefaultBaseBackgroundRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
 	  }
 	};
-	DefaultCircleBackgroundRenderContribution = __decorate$1h([injectable()], DefaultCircleBackgroundRenderContribution);
+	DefaultCircleBackgroundRenderContribution = __decorate$1j([injectable()], DefaultCircleBackgroundRenderContribution);
 	let DefaultCircleTextureRenderContribution = class extends DefaultBaseTextureRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke;
 	  }
 	};
-	DefaultCircleTextureRenderContribution = __decorate$1h([injectable()], DefaultCircleTextureRenderContribution);
+	DefaultCircleTextureRenderContribution = __decorate$1j([injectable()], DefaultCircleTextureRenderContribution);
 
-	var __decorate$1g = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1i = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27710,9 +27714,9 @@
 	    } else context.highPerformanceSave(), context.fillStyle = background, context.fill(), context.highPerformanceRestore();
 	  }
 	};
-	DefaultGroupBackgroundRenderContribution = __decorate$1g([injectable()], DefaultGroupBackgroundRenderContribution);
+	DefaultGroupBackgroundRenderContribution = __decorate$1i([injectable()], DefaultGroupBackgroundRenderContribution);
 
-	var __decorate$1f = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1h = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27749,9 +27753,9 @@
 	    }
 	  }
 	};
-	DefaultImageBackgroundRenderContribution = __decorate$1f([injectable()], DefaultImageBackgroundRenderContribution);
+	DefaultImageBackgroundRenderContribution = __decorate$1h([injectable()], DefaultImageBackgroundRenderContribution);
 
-	var __decorate$1e = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1g = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27799,19 +27803,19 @@
 	    }
 	  }
 	};
-	DefaultRectRenderContribution = __decorate$1e([injectable()], DefaultRectRenderContribution);
+	DefaultRectRenderContribution = __decorate$1g([injectable()], DefaultRectRenderContribution);
 	let DefaultRectBackgroundRenderContribution = class extends DefaultBaseBackgroundRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
 	  }
 	};
-	DefaultRectBackgroundRenderContribution = __decorate$1e([injectable()], DefaultRectBackgroundRenderContribution);
+	DefaultRectBackgroundRenderContribution = __decorate$1g([injectable()], DefaultRectBackgroundRenderContribution);
 	let DefaultRectTextureRenderContribution = class extends DefaultBaseTextureRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke;
 	  }
 	};
-	DefaultRectTextureRenderContribution = __decorate$1e([injectable()], DefaultRectTextureRenderContribution);
+	DefaultRectTextureRenderContribution = __decorate$1g([injectable()], DefaultRectTextureRenderContribution);
 	let SplitRectBeforeRenderContribution = class {
 	  constructor() {
 	    this.time = BaseRenderContributionTime.beforeFillStroke, this.useStyle = !0, this.order = 0;
@@ -27823,7 +27827,7 @@
 	    Array.isArray(stroke) && stroke.some(s => !1 === s) && (doFillOrStroke.doStroke = !1);
 	  }
 	};
-	SplitRectBeforeRenderContribution = __decorate$1e([injectable()], SplitRectBeforeRenderContribution);
+	SplitRectBeforeRenderContribution = __decorate$1g([injectable()], SplitRectBeforeRenderContribution);
 	let SplitRectAfterRenderContribution = class {
 	  constructor() {
 	    this.time = BaseRenderContributionTime.afterFillStroke, this.useStyle = !0, this.order = 0;
@@ -27843,9 +27847,9 @@
 	    }
 	  }
 	};
-	SplitRectAfterRenderContribution = __decorate$1e([injectable()], SplitRectAfterRenderContribution);
+	SplitRectAfterRenderContribution = __decorate$1g([injectable()], SplitRectAfterRenderContribution);
 
-	var __decorate$1d = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1f = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27888,7 +27892,7 @@
 	    }
 	  }
 	};
-	DefaultSymbolRenderContribution = __decorate$1d([injectable()], DefaultSymbolRenderContribution);
+	DefaultSymbolRenderContribution = __decorate$1f([injectable()], DefaultSymbolRenderContribution);
 	class DefaultSymbolBackgroundRenderContribution extends DefaultBaseBackgroundRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
@@ -27900,7 +27904,7 @@
 	  }
 	}
 
-	var __decorate$1c = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1e = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -27945,7 +27949,7 @@
 	    this.prepare(updateBounds), this.prepareRenderList(), this.beforeDraw(params), this.draw(params), this.afterDraw(params);
 	  }
 	};
-	DefaultRenderService = __decorate$1c([injectable(), __param$D(0, inject(DrawContribution)), __metadata$S("design:paramtypes", [Object])], DefaultRenderService);
+	DefaultRenderService = __decorate$1e([injectable(), __param$D(0, inject(DrawContribution)), __metadata$S("design:paramtypes", [Object])], DefaultRenderService);
 
 	var renderModule$1 = new ContainerModule(bind => {
 	  bind(DefaultRenderService).toSelf(), bind(RenderService).toService(DefaultRenderService);
@@ -28057,7 +28061,7 @@
 	  return result;
 	}
 
-	var __decorate$1b = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1d = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -28124,9 +28128,9 @@
 	    context.setTransformForCurrent();
 	  }
 	};
-	Canvas3DPickItemInterceptor = __decorate$1b([injectable()], Canvas3DPickItemInterceptor);
+	Canvas3DPickItemInterceptor = __decorate$1d([injectable()], Canvas3DPickItemInterceptor);
 
-	var __decorate$1a = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1c = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -28233,9 +28237,9 @@
 	    return picker || null;
 	  }
 	};
-	DefaultPickService = __decorate$1a([injectable(), __param$C(0, inject(Global)), __param$C(1, inject(ContributionProvider)), __param$C(1, named(PickItemInterceptor)), __metadata$R("design:paramtypes", [Object, Object])], DefaultPickService);
+	DefaultPickService = __decorate$1c([injectable(), __param$C(0, inject(Global)), __param$C(1, inject(ContributionProvider)), __param$C(1, named(PickItemInterceptor)), __metadata$R("design:paramtypes", [Object, Object])], DefaultPickService);
 
-	var __decorate$19 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1b = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -28295,7 +28299,7 @@
 	    return !1 === graphic.attribute.pickable ? null : graphic.AABBBounds.containsPoint(point) ? graphic : null;
 	  }
 	};
-	DefaultGlobalPickerService = __decorate$19([injectable(), __param$B(0, inject(Global)), __metadata$Q("design:paramtypes", [Object])], DefaultGlobalPickerService);
+	DefaultGlobalPickerService = __decorate$1b([injectable(), __param$B(0, inject(Global)), __metadata$Q("design:paramtypes", [Object])], DefaultGlobalPickerService);
 
 	function lookAt(out, eye, center, up) {
 	  let x0, x1, x2, y0, y1, y2, z0, z1, z2, len;
@@ -28412,7 +28416,7 @@
 	  }
 	}
 
-	var __decorate$18 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$1a = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -28921,9 +28925,9 @@
 	    this.stack.forEach(m => matrixAllocate.free(m)), this.stack.length = 0;
 	  }
 	};
-	BrowserContext2d.env = "browser", BrowserContext2d = __decorate$18([injectable(), __metadata$P("design:paramtypes", [Object, Number])], BrowserContext2d);
+	BrowserContext2d.env = "browser", BrowserContext2d = __decorate$1a([injectable(), __metadata$P("design:paramtypes", [Object, Number])], BrowserContext2d);
 
-	var __decorate$17 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$19 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -28951,9 +28955,15 @@
 	  get x() {
 	    return this._x;
 	  }
+	  set x(_x) {
+	    this._x = _x;
+	  }
 	  get y() {
 	    return this._y;
 	  }
+	  set y(_y) {
+	    this._y = _y;
+	  }
 	  get nativeCanvas() {
 	    return this._nativeCanvas;
 	  }
@@ -29061,7 +29071,7 @@
 	    this.controled && this._nativeCanvas.parentElement && this._nativeCanvas.parentElement.removeChild(this._nativeCanvas);
 	  }
 	};
-	BrowserCanvas.env = "browser", BrowserCanvas = __decorate$17([injectable(), __metadata$O("design:paramtypes", [Object])], BrowserCanvas);
+	BrowserCanvas.env = "browser", BrowserCanvas = __decorate$19([injectable(), __metadata$O("design:paramtypes", [Object])], BrowserCanvas);
 
 	const CanvasArcPicker = Symbol.for("CanvasArcPicker");
 	const CanvasArc3dPicker = Symbol.for("CanvasArc3dPicker");
@@ -29091,7 +29101,7 @@
 	const MathGlyphPicker = Symbol.for("MathGlyphPicker");
 	const MathPickerContribution = Symbol.for("MathPickerContribution");
 
-	var __decorate$16 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$18 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29139,9 +29149,9 @@
 	    return picker && picker.contains(graphic, point, params) ? graphic : null;
 	  }
 	};
-	__decorate$16([postConstruct(), __metadata$N("design:type", Function), __metadata$N("design:paramtypes", []), __metadata$N("design:returntype", void 0)], DefaultCanvasPickerService.prototype, "init", null), DefaultCanvasPickerService = __decorate$16([injectable(), __param$A(0, inject(ContributionProvider)), __param$A(0, named(CanvasPickerContribution)), __param$A(1, inject(CanvasCirclePicker)), __param$A(2, inject(CanvasRectPicker)), __param$A(3, inject(CanvasArcPicker)), __param$A(4, inject(CanvasAreaPicker)), __param$A(5, inject(CanvasImagePicker)), __param$A(6, inject(CanvasLinePicker)), __param$A(7, inject(CanvasPathPicker)), __param$A(8, inject(CanvasSymbolPicker)), __param$A(9, inject(CanvasTextPicker)), __param$A(10, inject(CanvasPolygonPicker)), __param$A(11, inject(CanvasRichTextPicker)), __param$A(12, inject(DrawContribution)), __param$A(13, inject(Global)), __param$A(14, inject(ContributionProvider)), __param$A(14, named(PickItemInterceptor)), __metadata$N("design:paramtypes", [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object])], DefaultCanvasPickerService);
+	__decorate$18([postConstruct(), __metadata$N("design:type", Function), __metadata$N("design:paramtypes", []), __metadata$N("design:returntype", void 0)], DefaultCanvasPickerService.prototype, "init", null), DefaultCanvasPickerService = __decorate$18([injectable(), __param$A(0, inject(ContributionProvider)), __param$A(0, named(CanvasPickerContribution)), __param$A(1, inject(CanvasCirclePicker)), __param$A(2, inject(CanvasRectPicker)), __param$A(3, inject(CanvasArcPicker)), __param$A(4, inject(CanvasAreaPicker)), __param$A(5, inject(CanvasImagePicker)), __param$A(6, inject(CanvasLinePicker)), __param$A(7, inject(CanvasPathPicker)), __param$A(8, inject(CanvasSymbolPicker)), __param$A(9, inject(CanvasTextPicker)), __param$A(10, inject(CanvasPolygonPicker)), __param$A(11, inject(CanvasRichTextPicker)), __param$A(12, inject(DrawContribution)), __param$A(13, inject(Global)), __param$A(14, inject(ContributionProvider)), __param$A(14, named(PickItemInterceptor)), __metadata$N("design:paramtypes", [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object])], DefaultCanvasPickerService);
 
-	var __decorate$15 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$17 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29355,9 +29365,9 @@
 	    this.stack.forEach(m => matrixAllocate.free(m)), this.stack.length = 0;
 	  }
 	};
-	EmptyContext2d = __decorate$15([injectable(), __metadata$M("design:paramtypes", [Object, Number])], EmptyContext2d);
+	EmptyContext2d = __decorate$17([injectable(), __metadata$M("design:paramtypes", [Object, Number])], EmptyContext2d);
 
-	var __decorate$14 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$16 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29392,7 +29402,7 @@
 	    return picker && picker.contains(graphic, point, params) ? graphic : null;
 	  }
 	};
-	__decorate$14([postConstruct(), __metadata$L("design:type", Function), __metadata$L("design:paramtypes", []), __metadata$L("design:returntype", void 0)], DefaultMathPickerService.prototype, "init", null), DefaultMathPickerService = __decorate$14([injectable(), __param$z(0, inject(ContributionProvider)), __param$z(0, named(MathPickerContribution)), __param$z(1, inject(Global)), __param$z(2, inject(ContributionProvider)), __param$z(2, named(PickItemInterceptor)), __metadata$L("design:paramtypes", [Object, Object, Object])], DefaultMathPickerService);
+	__decorate$16([postConstruct(), __metadata$L("design:type", Function), __metadata$L("design:paramtypes", []), __metadata$L("design:returntype", void 0)], DefaultMathPickerService.prototype, "init", null), DefaultMathPickerService = __decorate$16([injectable(), __param$z(0, inject(ContributionProvider)), __param$z(0, named(MathPickerContribution)), __param$z(1, inject(Global)), __param$z(2, inject(ContributionProvider)), __param$z(2, named(PickItemInterceptor)), __metadata$L("design:paramtypes", [Object, Object, Object])], DefaultMathPickerService);
 
 	var pickModule = new ContainerModule(bind => {
 	  bind(DefaultCanvasPickerService).toSelf().inSingletonScope(), bind(DefaultMathPickerService).toSelf().inSingletonScope(), bind(PickerService).toService(DefaultCanvasPickerService), bind(DefaultGlobalPickerService).toSelf().inSingletonScope(), bind(GlobalPickerService).toService(DefaultGlobalPickerService), bind(Canvas3DPickItemInterceptor).toSelf().inSingletonScope(), bind(PickItemInterceptor).toService(Canvas3DPickItemInterceptor), bindContributionProvider(bind, PickItemInterceptor);
@@ -29405,7 +29415,7 @@
 	const AutoEnablePlugins = Symbol.for("AutoEnablePlugins");
 	const PluginService = Symbol.for("PluginService");
 
-	var __decorate$13 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$15 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29452,13 +29462,13 @@
 	    }), this.onRegisterPlugin = [];
 	  }
 	};
-	DefaultPluginService = __decorate$13([injectable(), __param$y(0, inject(ContributionProvider)), __param$y(0, named(AutoEnablePlugins)), __metadata$K("design:paramtypes", [Object])], DefaultPluginService);
+	DefaultPluginService = __decorate$15([injectable(), __param$y(0, inject(ContributionProvider)), __param$y(0, named(AutoEnablePlugins)), __metadata$K("design:paramtypes", [Object])], DefaultPluginService);
 
 	var pluginModule = new ContainerModule(bind => {
 	  bind(DefaultPluginService).toSelf(), bind(PluginService).toService(DefaultPluginService), bindContributionProvider(bind, AutoEnablePlugins);
 	});
 
-	var __decorate$12 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$14 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29510,9 +29520,9 @@
 	    }));
 	  }
 	};
-	BaseEnvContribution = __decorate$12([injectable()], BaseEnvContribution);
+	BaseEnvContribution = __decorate$14([injectable()], BaseEnvContribution);
 
-	var __decorate$11 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$13 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29522,7 +29532,7 @@
 	  __metadata$J = undefined && undefined.__metadata || function (k, v) {
 	    if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(k, v);
 	  };
-	function createImageElement(src) {
+	function createImageElement$1(src) {
 	  let isSvg = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !1;
 	  const img = document.createElement("img");
 	  if (img.crossOrigin = "anonymous", isSvg) {
@@ -29571,7 +29581,7 @@
 	    };
 	  }
 	  loadImage(url) {
-	    return createImageElement(url, !1).then(img => ({
+	    return createImageElement$1(url, !1).then(img => ({
 	      data: img,
 	      loadState: "success"
 	    })).catch(() => ({
@@ -29580,7 +29590,7 @@
 	    }));
 	  }
 	  loadSvg(url) {
-	    return createImageElement(url, !0).then(img => ({
+	    return createImageElement$1(url, !0).then(img => ({
 	      data: img,
 	      loadState: "success"
 	    })).catch(() => ({
@@ -29633,7 +29643,7 @@
 	  }
 	  release() {}
 	};
-	BrowserEnvContribution = __decorate$11([injectable(), __metadata$J("design:paramtypes", [])], BrowserEnvContribution);
+	BrowserEnvContribution = __decorate$13([injectable(), __metadata$J("design:paramtypes", [])], BrowserEnvContribution);
 
 	function loadFeishuContributions() {
 	  container.rebind(PickerService).toService(DefaultMathPickerService);
@@ -29642,7 +29652,7 @@
 	  container.rebind(PickerService).toService(DefaultMathPickerService);
 	}
 
-	var __decorate$10 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$12 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29746,9 +29756,9 @@
 	    return (null === (_a = null == event ? void 0 : event.type) || void 0 === _a ? void 0 : _a.startsWith("mouse")) ? event : null;
 	  }
 	};
-	FeishuEnvContribution = __decorate$10([injectable(), __metadata$I("design:paramtypes", [])], FeishuEnvContribution);
+	FeishuEnvContribution = __decorate$12([injectable(), __metadata$I("design:paramtypes", [])], FeishuEnvContribution);
 
-	var __decorate$$ = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$11 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29880,9 +29890,9 @@
 	  }
 	  release() {}
 	};
-	TaroEnvContribution = __decorate$$([injectable(), __metadata$H("design:paramtypes", [])], TaroEnvContribution);
+	TaroEnvContribution = __decorate$11([injectable(), __metadata$H("design:paramtypes", [])], TaroEnvContribution);
 
-	var __decorate$_ = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$10 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -29920,6 +29930,18 @@
 	    canvasMap.set(id, canvas), i >= freeCanvasIdx && freeCanvasList.push(canvas);
 	  });
 	}
+	function createImageElement(src) {
+	  let isSvg = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !1;
+	  if (isSvg) return Promise.reject();
+	  const img = lynx.createImage(src);
+	  return new Promise((resolve, reject) => {
+	    img.onload = () => {
+	      resolve(img);
+	    }, img.onerror = () => {
+	      reject(new Error("加载失败"));
+	    };
+	  });
+	}
 	let LynxEnvContribution = class extends BaseEnvContribution {
 	  constructor() {
 	    super(), this.type = "lynx", this.supportEvent = !0, this.canvasMap = new Map(), this.freeCanvasList = [], this.canvasIdx = 0, this.supportsTouchEvents = !0;
@@ -29940,10 +29962,13 @@
 	    return this.freeCanvasList.length;
 	  }
 	  loadImage(url) {
-	    return Promise.resolve({
-	      data: url,
+	    return createImageElement(url, !1).then(img => ({
+	      data: img,
 	      loadState: "success"
-	    });
+	    })).catch(() => ({
+	      data: null,
+	      loadState: "fail"
+	    }));
 	  }
 	  loadSvg(url) {
 	    return Promise.reject();
@@ -29987,9 +30012,9 @@
 	  }
 	  release() {}
 	};
-	LynxEnvContribution = __decorate$_([injectable(), __metadata$G("design:paramtypes", [])], LynxEnvContribution);
+	LynxEnvContribution = __decorate$10([injectable(), __metadata$G("design:paramtypes", [])], LynxEnvContribution);
 
-	var __decorate$Z = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$$ = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30075,9 +30100,9 @@
 	  release() {}
 	  createOffscreenCanvas(params) {}
 	};
-	NodeEnvContribution = __decorate$Z([injectable()], NodeEnvContribution);
+	NodeEnvContribution = __decorate$$([injectable()], NodeEnvContribution);
 
-	var __decorate$Y = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$_ = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30198,13 +30223,13 @@
 	    return (null === (_a = null == event ? void 0 : event.type) || void 0 === _a ? void 0 : _a.startsWith("mouse")) ? event : null;
 	  }
 	};
-	WxEnvContribution = __decorate$Y([injectable(), __metadata$F("design:paramtypes", [])], WxEnvContribution);
+	WxEnvContribution = __decorate$_([injectable(), __metadata$F("design:paramtypes", [])], WxEnvContribution);
 
 	var envModules = new ContainerModule(bind => {
 	  bind(BrowserEnvContribution).toSelf().inSingletonScope(), bind(EnvContribution).toService(BrowserEnvContribution), bind(FeishuEnvContribution).toSelf().inSingletonScope(), bind(EnvContribution).toService(FeishuEnvContribution), bind(TaroEnvContribution).toSelf().inSingletonScope(), bind(EnvContribution).toService(TaroEnvContribution), bind(LynxEnvContribution).toSelf().inSingletonScope(), bind(EnvContribution).toService(LynxEnvContribution), bind(WxEnvContribution).toSelf().inSingletonScope(), bind(EnvContribution).toService(WxEnvContribution), bind(NodeEnvContribution).toSelf().inSingletonScope(), bind(EnvContribution).toService(NodeEnvContribution), bindContributionProvider(bind, EnvContribution);
 	});
 
-	var __decorate$X = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$Z = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30228,9 +30253,9 @@
 	    this.releaseWindow();
 	  }
 	};
-	BaseWindowHandlerContribution = __decorate$X([injectable(), __metadata$E("design:paramtypes", [])], BaseWindowHandlerContribution);
+	BaseWindowHandlerContribution = __decorate$Z([injectable(), __metadata$E("design:paramtypes", [])], BaseWindowHandlerContribution);
 
-	var __decorate$W = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$Y = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30364,9 +30389,9 @@
 	    context.nativeContext.save(), context.nativeContext.setTransform(dpr, 0, 0, dpr, 0, 0), context.clearRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1), color && (context.fillStyle = color, context.fillRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1)), context.nativeContext.restore();
 	  }
 	};
-	BrowserWindowHandlerContribution.env = "browser", BrowserWindowHandlerContribution = __decorate$W([injectable(), __param$x(0, inject(Global)), __metadata$D("design:paramtypes", [Object])], BrowserWindowHandlerContribution);
+	BrowserWindowHandlerContribution.env = "browser", BrowserWindowHandlerContribution = __decorate$Y([injectable(), __param$x(0, inject(Global)), __metadata$D("design:paramtypes", [Object])], BrowserWindowHandlerContribution);
 
-	var __decorate$V = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$X = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30411,9 +30436,9 @@
 	    return null;
 	  }
 	};
-	FeishuContext2d.env = "feishu", FeishuContext2d = __decorate$V([injectable()], FeishuContext2d);
+	FeishuContext2d.env = "feishu", FeishuContext2d = __decorate$X([injectable()], FeishuContext2d);
 
-	var __decorate$U = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$W = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30435,9 +30460,15 @@
 	  get x() {
 	    return this._x;
 	  }
+	  set x(_x) {
+	    this._x = _x;
+	  }
 	  get y() {
 	    return this._y;
 	  }
+	  set y(_y) {
+	    this._y = _y;
+	  }
 	  get nativeCanvas() {
 	    return this._nativeCanvas;
 	  }
@@ -30512,9 +30543,9 @@
 	  }
 	  release() {}
 	};
-	FeishuCanvas.env = "feishu", FeishuCanvas = __decorate$U([injectable(), __metadata$C("design:paramtypes", [Object])], FeishuCanvas);
+	FeishuCanvas.env = "feishu", FeishuCanvas = __decorate$W([injectable(), __metadata$C("design:paramtypes", [Object])], FeishuCanvas);
 
-	var __decorate$T = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$V = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30659,9 +30690,9 @@
 	    context.nativeContext.save(), context.nativeContext.setTransform(dpr, 0, 0, dpr, 0, 0), context.clearRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1), color && (context.fillStyle = color, context.fillRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1)), context.nativeContext.restore();
 	  }
 	};
-	FeishuWindowHandlerContribution.env = "feishu", FeishuWindowHandlerContribution = __decorate$T([injectable(), __param$w(0, inject(Global)), __metadata$B("design:paramtypes", [Object])], FeishuWindowHandlerContribution);
+	FeishuWindowHandlerContribution.env = "feishu", FeishuWindowHandlerContribution = __decorate$V([injectable(), __param$w(0, inject(Global)), __metadata$B("design:paramtypes", [Object])], FeishuWindowHandlerContribution);
 
-	var __decorate$S = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$U = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30725,9 +30756,9 @@
 	    return null;
 	  }
 	};
-	TaroContext2d.env = "taro", TaroContext2d = __decorate$S([injectable()], TaroContext2d);
+	TaroContext2d.env = "taro", TaroContext2d = __decorate$U([injectable()], TaroContext2d);
 
-	var __decorate$R = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$T = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30749,9 +30780,15 @@
 	  get x() {
 	    return this._x;
 	  }
+	  set x(_x) {
+	    this._x = _x;
+	  }
 	  get y() {
 	    return this._y;
 	  }
+	  set y(_y) {
+	    this._y = _y;
+	  }
 	  get nativeCanvas() {
 	    return this._nativeCanvas;
 	  }
@@ -30826,9 +30863,9 @@
 	  }
 	  release() {}
 	};
-	TaroCanvas.env = "taro", TaroCanvas = __decorate$R([injectable(), __metadata$A("design:paramtypes", [Object])], TaroCanvas);
+	TaroCanvas.env = "taro", TaroCanvas = __decorate$T([injectable(), __metadata$A("design:paramtypes", [Object])], TaroCanvas);
 
-	var __decorate$Q = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$S = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -30983,9 +31020,9 @@
 	    context.nativeContext.save(), context.nativeContext.setTransform(dpr, 0, 0, dpr, 0, 0), context.clearRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1), color && (context.fillStyle = color, context.fillRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1)), context.nativeContext.restore();
 	  }
 	};
-	TaroWindowHandlerContribution.env = "taro", TaroWindowHandlerContribution = __decorate$Q([injectable(), __param$v(0, inject(Global)), __metadata$z("design:paramtypes", [Object])], TaroWindowHandlerContribution);
+	TaroWindowHandlerContribution.env = "taro", TaroWindowHandlerContribution = __decorate$S([injectable(), __param$v(0, inject(Global)), __metadata$z("design:paramtypes", [Object])], TaroWindowHandlerContribution);
 
-	var __decorate$P = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$R = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31039,9 +31076,9 @@
 	    });
 	  }
 	};
-	LynxContext2d.env = "lynx", LynxContext2d = __decorate$P([injectable()], LynxContext2d);
+	LynxContext2d.env = "lynx", LynxContext2d = __decorate$R([injectable()], LynxContext2d);
 
-	var __decorate$O = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$Q = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31063,9 +31100,15 @@
 	  get x() {
 	    return this._x;
 	  }
+	  set x(_x) {
+	    this._x = _x;
+	  }
 	  get y() {
 	    return this._y;
 	  }
+	  set y(_y) {
+	    this._y = _y;
+	  }
 	  get nativeCanvas() {
 	    return this._nativeCanvas;
 	  }
@@ -31140,9 +31183,9 @@
 	  }
 	  release() {}
 	};
-	LynxCanvas.env = "lynx", LynxCanvas = __decorate$O([injectable(), __metadata$y("design:paramtypes", [Object])], LynxCanvas);
+	LynxCanvas.env = "lynx", LynxCanvas = __decorate$Q([injectable(), __metadata$y("design:paramtypes", [Object])], LynxCanvas);
 
-	var __decorate$N = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$P = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31287,9 +31330,9 @@
 	    context.nativeContext.save(), context.nativeContext.setTransform(dpr, 0, 0, dpr, 0, 0), context.clearRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1), color && (context.fillStyle = color, context.fillRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1)), context.nativeContext.restore();
 	  }
 	};
-	LynxWindowHandlerContribution.env = "lynx", LynxWindowHandlerContribution = __decorate$N([injectable(), __param$u(0, inject(Global)), __metadata$x("design:paramtypes", [Object])], LynxWindowHandlerContribution);
+	LynxWindowHandlerContribution.env = "lynx", LynxWindowHandlerContribution = __decorate$P([injectable(), __param$u(0, inject(Global)), __metadata$x("design:paramtypes", [Object])], LynxWindowHandlerContribution);
 
-	var __decorate$M = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$O = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31308,9 +31351,9 @@
 	  }
 	  release() {}
 	};
-	NodeContext2d.env = "node", NodeContext2d = __decorate$M([injectable(), __metadata$w("design:paramtypes", [Object, Number])], NodeContext2d);
+	NodeContext2d.env = "node", NodeContext2d = __decorate$O([injectable(), __metadata$w("design:paramtypes", [Object, Number])], NodeContext2d);
 
-	var __decorate$L = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$N = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31332,9 +31375,11 @@
 	  get x() {
 	    return 0;
 	  }
+	  set x(_x) {}
 	  get y() {
 	    return 0;
 	  }
+	  set y(_y) {}
 	  get nativeCanvas() {
 	    return this._nativeCanvas;
 	  }
@@ -31407,9 +31452,9 @@
 	    this._nativeCanvas.release && isFunction(this._nativeCanvas.release) && this._nativeCanvas.release();
 	  }
 	};
-	NodeCanvas.env = "node", NodeCanvas = __decorate$L([injectable(), __metadata$v("design:paramtypes", [Object])], NodeCanvas);
+	NodeCanvas.env = "node", NodeCanvas = __decorate$N([injectable(), __metadata$v("design:paramtypes", [Object])], NodeCanvas);
 
-	var __decorate$K = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$M = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31510,9 +31555,9 @@
 	  }
 	  clearViewBox(vb, color) {}
 	};
-	NodeWindowHandlerContribution.env = "node", NodeWindowHandlerContribution = __decorate$K([injectable(), __param$t(0, inject(Global)), __metadata$u("design:paramtypes", [Object])], NodeWindowHandlerContribution);
+	NodeWindowHandlerContribution.env = "node", NodeWindowHandlerContribution = __decorate$M([injectable(), __param$t(0, inject(Global)), __metadata$u("design:paramtypes", [Object])], NodeWindowHandlerContribution);
 
-	var __decorate$J = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$L = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31525,9 +31570,9 @@
 	    return null;
 	  }
 	};
-	WxContext2d.env = "wx", WxContext2d = __decorate$J([injectable()], WxContext2d);
+	WxContext2d.env = "wx", WxContext2d = __decorate$L([injectable()], WxContext2d);
 
-	var __decorate$I = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$K = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31549,9 +31594,15 @@
 	  get x() {
 	    return this._x;
 	  }
+	  set x(_x) {
+	    this._x = _x;
+	  }
 	  get y() {
 	    return this._y;
 	  }
+	  set y(_y) {
+	    this._y = _y;
+	  }
 	  get nativeCanvas() {
 	    return this._nativeCanvas;
 	  }
@@ -31626,9 +31677,9 @@
 	  }
 	  release() {}
 	};
-	WxCanvas.env = "wx", WxCanvas = __decorate$I([injectable(), __metadata$t("design:paramtypes", [Object])], WxCanvas);
+	WxCanvas.env = "wx", WxCanvas = __decorate$K([injectable(), __metadata$t("design:paramtypes", [Object])], WxCanvas);
 
-	var __decorate$H = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$J = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31774,7 +31825,7 @@
 	    context.nativeContext.save(), context.nativeContext.setTransform(dpr, 0, 0, dpr, 0, 0), context.clearRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1), color && (context.fillStyle = color, context.fillRect(vb.x1, vb.y1, vb.x2 - vb.x1, vb.y2 - vb.y1)), context.nativeContext.restore();
 	  }
 	};
-	WxWindowHandlerContribution.env = "wx", WxWindowHandlerContribution = __decorate$H([injectable(), __param$s(0, inject(Global)), __metadata$s("design:paramtypes", [Object])], WxWindowHandlerContribution);
+	WxWindowHandlerContribution.env = "wx", WxWindowHandlerContribution = __decorate$J([injectable(), __param$s(0, inject(Global)), __metadata$s("design:paramtypes", [Object])], WxWindowHandlerContribution);
 
 	var windowModules = new ContainerModule(bind => {
 	  bind(BrowserWindowHandlerContribution).toSelf(), bind(WindowHandlerContribution).toDynamicValue(ctx => ctx.container.get(BrowserWindowHandlerContribution)).whenTargetNamed(BrowserWindowHandlerContribution.env), bind(FeishuWindowHandlerContribution).toSelf(), bind(WindowHandlerContribution).toDynamicValue(ctx => ctx.container.get(FeishuWindowHandlerContribution)).whenTargetNamed(FeishuWindowHandlerContribution.env), bind(TaroWindowHandlerContribution).toSelf(), bind(WindowHandlerContribution).toDynamicValue(ctx => ctx.container.get(TaroWindowHandlerContribution)).whenTargetNamed(TaroWindowHandlerContribution.env), bind(LynxWindowHandlerContribution).toSelf(), bind(WindowHandlerContribution).toDynamicValue(ctx => ctx.container.get(LynxWindowHandlerContribution)).whenTargetNamed(LynxWindowHandlerContribution.env), bind(WxWindowHandlerContribution).toSelf(), bind(WindowHandlerContribution).toDynamicValue(ctx => ctx.container.get(WxWindowHandlerContribution)).whenTargetNamed(WxWindowHandlerContribution.env), bind(NodeWindowHandlerContribution).toSelf(), bind(WindowHandlerContribution).toDynamicValue(ctx => ctx.container.get(NodeWindowHandlerContribution)).whenTargetNamed(NodeWindowHandlerContribution.env);
@@ -31784,7 +31835,7 @@
 	  bind(DefaultTextMeasureContribution).toSelf().inSingletonScope(), bind(TextMeasureContribution).toService(DefaultTextMeasureContribution), bindContributionProvider(bind, TextMeasureContribution);
 	});
 
-	var __decorate$G = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$I = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31804,9 +31855,9 @@
 	    this.global = global, this.offscreen = !1;
 	  }
 	  init(layer, window, params) {
-	    if (this.layer = layer, params.main) this.context = window.getContext(), this.canvas = this.context.getCanvas();else {
+	    if (this.layer = layer, this.window = window, params.main) this.main = !0, this.context = window.getContext(), this.canvas = this.context.getCanvas();else {
 	      let nativeCanvas;
-	      nativeCanvas = params.canvasId ? this.global.getElementById(params.canvasId) : this.global.createCanvas({
+	      this.main = !1, nativeCanvas = params.canvasId ? this.global.getElementById(params.canvasId) : this.global.createCanvas({
 	        width: window.width,
 	        height: window.height
 	      }), nativeCanvas.style && (nativeCanvas.style["pointer-events"] = "none");
@@ -31830,6 +31881,10 @@
 	  resizeView(w, h) {}
 	  render(group, params, userParams) {
 	    var _a;
+	    if (!this.main) {
+	      const windowCanvas = this.window.getContext().getCanvas().nativeCanvas;
+	      !windowCanvas || this.canvas.x === windowCanvas.offsetLeft && this.canvas.y === windowCanvas.offsetTop || (this.canvas.x = windowCanvas.offsetLeft, this.canvas.y = windowCanvas.offsetTop, this.canvas.applyPosition());
+	    }
 	    params.renderService.render(group, Object.assign(Object.assign({
 	      context: this.context,
 	      clear: null !== (_a = params.background) && void 0 !== _a ? _a : "#ffffff"
@@ -31858,9 +31913,9 @@
 	    this.canvas.release();
 	  }
 	};
-	CanvasLayerHandlerContribution = __decorate$G([injectable(), __param$r(0, inject(Global)), __metadata$r("design:paramtypes", [Object])], CanvasLayerHandlerContribution);
+	CanvasLayerHandlerContribution = __decorate$I([injectable(), __param$r(0, inject(Global)), __metadata$r("design:paramtypes", [Object])], CanvasLayerHandlerContribution);
 
-	var __decorate$F = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$H = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31931,7 +31986,7 @@
 	  }
 	  merge(layerHandlers) {}
 	};
-	OffscreenLayerHandlerContribution = __decorate$F([injectable(), __param$q(0, inject(Global)), __metadata$q("design:paramtypes", [Object])], OffscreenLayerHandlerContribution);
+	OffscreenLayerHandlerContribution = __decorate$H([injectable(), __param$q(0, inject(Global)), __metadata$q("design:paramtypes", [Object])], OffscreenLayerHandlerContribution);
 
 	var layerHandlerModules = new ContainerModule(bind => {
 	  bind(CanvasLayerHandlerContribution).toSelf(), bind(OffscreenLayerHandlerContribution).toSelf(), bind(LayerHandlerContribution).toService(CanvasLayerHandlerContribution);
@@ -31941,7 +31996,7 @@
 	  container.load(envModules), container.load(windowModules), container.load(textMeasureModules), container.load(layerHandlerModules);
 	}
 
-	var __decorate$E = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$G = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -31967,7 +32022,7 @@
 	    return drawContribution.renderGroup(graphic.shadowRoot, drawContext), context.highPerformanceRestore(), drawContribution.dirtyBounds && drawContribution.backupDirtyBounds && drawContribution.dirtyBounds.copy(tempDirtyBounds), !0;
 	  }
 	};
-	ShadowRootDrawItemInterceptorContribution = __decorate$E([injectable()], ShadowRootDrawItemInterceptorContribution);
+	ShadowRootDrawItemInterceptorContribution = __decorate$G([injectable()], ShadowRootDrawItemInterceptorContribution);
 	let Canvas3DDrawItemInterceptor = class {
 	  constructor() {
 	    this.order = 1;
@@ -32040,9 +32095,9 @@
 	    context.setTransformForCurrent();
 	  }
 	};
-	Canvas3DDrawItemInterceptor = __decorate$E([injectable()], Canvas3DDrawItemInterceptor);
+	Canvas3DDrawItemInterceptor = __decorate$G([injectable()], Canvas3DDrawItemInterceptor);
 
-	var __decorate$D = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$F = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32213,9 +32268,9 @@
 	    }
 	  }
 	};
-	__decorate$D([postConstruct(), __metadata$p("design:type", Function), __metadata$p("design:paramtypes", []), __metadata$p("design:returntype", void 0)], DefaultDrawContribution.prototype, "init", null), DefaultDrawContribution = __decorate$D([injectable(), __param$p(0, multiInject(GraphicRender)), __param$p(1, inject(RenderSelector)), __param$p(2, inject(LayerService)), __param$p(3, inject(ContributionProvider)), __param$p(3, named(DrawItemInterceptor)), __metadata$p("design:paramtypes", [Array, Object, Object, Object])], DefaultDrawContribution);
+	__decorate$F([postConstruct(), __metadata$p("design:type", Function), __metadata$p("design:paramtypes", []), __metadata$p("design:returntype", void 0)], DefaultDrawContribution.prototype, "init", null), DefaultDrawContribution = __decorate$F([injectable(), __param$p(0, multiInject(GraphicRender)), __param$p(1, inject(RenderSelector)), __param$p(2, inject(LayerService)), __param$p(3, inject(ContributionProvider)), __param$p(3, named(DrawItemInterceptor)), __metadata$p("design:paramtypes", [Array, Object, Object, Object])], DefaultDrawContribution);
 
-	var __decorate$C = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$E = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32227,9 +32282,9 @@
 	    return null;
 	  }
 	};
-	DefaultRenderSelector = __decorate$C([injectable()], DefaultRenderSelector);
+	DefaultRenderSelector = __decorate$E([injectable()], DefaultRenderSelector);
 
-	var __decorate$B = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$D = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32320,9 +32375,9 @@
 	    }) : clip ? context.restore() : context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasGroupRender = __decorate$B([injectable(), __param$o(0, inject(ContributionProvider)), __param$o(0, named(GroupRenderContribution)), __metadata$o("design:paramtypes", [Object])], DefaultCanvasGroupRender);
+	DefaultCanvasGroupRender = __decorate$D([injectable(), __param$o(0, inject(ContributionProvider)), __param$o(0, named(GroupRenderContribution)), __metadata$o("design:paramtypes", [Object])], DefaultCanvasGroupRender);
 
-	var __decorate$A = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$C = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32373,9 +32428,9 @@
 	    }), context.setShadowStyle && context.setShadowStyle(line, attribute, defaultAttribute), context.setStrokeStyle(line, attribute, offsetX, offsetY, defaultAttribute), context.stroke());
 	  }
 	};
-	DefaultIncrementalCanvasLineRender = __decorate$A([injectable()], DefaultIncrementalCanvasLineRender);
+	DefaultIncrementalCanvasLineRender = __decorate$C([injectable()], DefaultIncrementalCanvasLineRender);
 
-	var __decorate$z = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$B = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32418,10 +32473,10 @@
 	    }), context.setShadowStyle && context.setShadowStyle(area, attribute, defaultAttribute), context.setCommonStyle(area, attribute, offsetX, offsetY, defaultAttribute), context.fill());
 	  }
 	};
-	DefaultIncrementalCanvasAreaRender = __decorate$z([injectable()], DefaultIncrementalCanvasAreaRender);
+	DefaultIncrementalCanvasAreaRender = __decorate$B([injectable()], DefaultIncrementalCanvasAreaRender);
 
 	var STATUS,
-	  __decorate$y = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	  __decorate$A = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32565,9 +32620,9 @@
 	    });
 	  }
 	};
-	__decorate$y([inject(Global), __metadata$n("design:type", Object)], DefaultIncrementalDrawContribution.prototype, "global", void 0), DefaultIncrementalDrawContribution = __decorate$y([injectable(), __param$n(0, multiInject(GraphicRender)), __param$n(1, inject(RenderSelector)), __param$n(2, inject(DefaultIncrementalCanvasLineRender)), __param$n(3, inject(DefaultIncrementalCanvasAreaRender)), __param$n(4, inject(LayerService)), __param$n(5, inject(ContributionProvider)), __param$n(5, named(DrawItemInterceptor)), __metadata$n("design:paramtypes", [Array, Object, Object, Object, Object, Object])], DefaultIncrementalDrawContribution);
+	__decorate$A([inject(Global), __metadata$n("design:type", Object)], DefaultIncrementalDrawContribution.prototype, "global", void 0), DefaultIncrementalDrawContribution = __decorate$A([injectable(), __param$n(0, multiInject(GraphicRender)), __param$n(1, inject(RenderSelector)), __param$n(2, inject(DefaultIncrementalCanvasLineRender)), __param$n(3, inject(DefaultIncrementalCanvasAreaRender)), __param$n(4, inject(LayerService)), __param$n(5, inject(ContributionProvider)), __param$n(5, named(DrawItemInterceptor)), __metadata$n("design:paramtypes", [Array, Object, Object, Object, Object, Object])], DefaultIncrementalDrawContribution);
 
-	var __decorate$x = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$z = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32698,9 +32753,9 @@
 	    this.z = z, this.drawShape(rect, context, x, y, drawContext), this.z = 0, context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix, context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasRect3dRender = __decorate$x([injectable()], DefaultCanvasRect3dRender);
+	DefaultCanvasRect3dRender = __decorate$z([injectable()], DefaultCanvasRect3dRender);
 
-	var __decorate$w = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$y = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32770,9 +32825,9 @@
 	    this.drawShape(richtext, context, x, y, drawContext), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasRichTextRender = __decorate$w([injectable()], DefaultCanvasRichTextRender);
+	DefaultCanvasRichTextRender = __decorate$y([injectable()], DefaultCanvasRichTextRender);
 
-	var __decorate$v = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$x = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32804,9 +32859,9 @@
 	    }), context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasGlyphRender = __decorate$v([injectable()], DefaultCanvasGlyphRender);
+	DefaultCanvasGlyphRender = __decorate$x([injectable()], DefaultCanvasGlyphRender);
 
-	var __decorate$u = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$w = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -32946,9 +33001,9 @@
 	    this.z = z, drawPathProxy(arc, context, x, y, drawContext, params) || (this.drawShape(arc, context, x, y, drawContext, params), this.z = 0, context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix), context.restore();
 	  }
 	};
-	DefaultCanvasArc3DRender = __decorate$u([injectable()], DefaultCanvasArc3DRender);
+	DefaultCanvasArc3DRender = __decorate$w([injectable()], DefaultCanvasArc3DRender);
 
-	var __decorate$t = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$v = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33080,9 +33135,9 @@
 	    this.z = z, this.drawShape(pyramid3d, context, x, y, drawContext), this.z = 0, context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix, context.highPerformanceRestore();
 	  }
 	};
-	DefaultCanvasPyramid3dRender = __decorate$t([injectable()], DefaultCanvasPyramid3dRender);
+	DefaultCanvasPyramid3dRender = __decorate$v([injectable()], DefaultCanvasPyramid3dRender);
 
-	var __decorate$s = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$u = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33094,15 +33149,15 @@
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
 	  }
 	};
-	DefaultPolygonBackgroundRenderContribution = __decorate$s([injectable()], DefaultPolygonBackgroundRenderContribution);
+	DefaultPolygonBackgroundRenderContribution = __decorate$u([injectable()], DefaultPolygonBackgroundRenderContribution);
 	let DefaultPolygonTextureRenderContribution = class extends DefaultBaseTextureRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke;
 	  }
 	};
-	DefaultPolygonTextureRenderContribution = __decorate$s([injectable()], DefaultPolygonTextureRenderContribution);
+	DefaultPolygonTextureRenderContribution = __decorate$u([injectable()], DefaultPolygonTextureRenderContribution);
 
-	var __decorate$r = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$t = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33114,15 +33169,15 @@
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
 	  }
 	};
-	DefaultPathBackgroundRenderContribution = __decorate$r([injectable()], DefaultPathBackgroundRenderContribution);
+	DefaultPathBackgroundRenderContribution = __decorate$t([injectable()], DefaultPathBackgroundRenderContribution);
 	let DefaultPathTextureRenderContribution = class extends DefaultBaseTextureRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke;
 	  }
 	};
-	DefaultPathTextureRenderContribution = __decorate$r([injectable()], DefaultPathTextureRenderContribution);
+	DefaultPathTextureRenderContribution = __decorate$t([injectable()], DefaultPathTextureRenderContribution);
 
-	var __decorate$q = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$s = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33134,7 +33189,7 @@
 	    super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
 	  }
 	};
-	DefaultAreaBackgroundRenderContribution = __decorate$q([injectable()], DefaultAreaBackgroundRenderContribution);
+	DefaultAreaBackgroundRenderContribution = __decorate$s([injectable()], DefaultAreaBackgroundRenderContribution);
 	let DefaultAreaTextureRenderContribution = class extends DefaultBaseTextureRenderContribution {
 	  constructor() {
 	    super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke;
@@ -33181,7 +33236,7 @@
 	    pattern && (context.highPerformanceSave(), context.setCommonStyle(graphic, graphic.attribute, x, y, graphicAttribute), context.fillStyle = pattern, context.fill(), context.highPerformanceRestore());
 	  }
 	};
-	DefaultAreaTextureRenderContribution = __decorate$q([injectable()], DefaultAreaTextureRenderContribution);
+	DefaultAreaTextureRenderContribution = __decorate$s([injectable()], DefaultAreaTextureRenderContribution);
 
 	var renderModule = new ContainerModule(bind => {
 	  bind(DefaultDrawContribution).toSelf(), bind(DrawContribution).toService(DefaultDrawContribution), bind(DefaultIncrementalDrawContribution).toSelf(), bind(IncrementalDrawContribution).toService(DefaultIncrementalDrawContribution), bind(DefaultRenderSelector).toSelf(), bind(RenderSelector).toService(DefaultRenderSelector), bind(DefaultCanvasCircleRender).toSelf().inSingletonScope(), bind(CircleRender).to(DefaultCanvasCircleRender), bind(GraphicRender).to(DefaultCanvasCircleRender), bind(DefaultCircleRenderContribution).toSelf().inSingletonScope(), bind(DefaultCircleBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultCircleTextureRenderContribution).toSelf().inSingletonScope(), bind(CircleRenderContribution).toService(DefaultCircleRenderContribution), bind(CircleRenderContribution).toService(DefaultCircleBackgroundRenderContribution), bind(CircleRenderContribution).toService(DefaultCircleTextureRenderContribution), bindContributionProvider(bind, CircleRenderContribution), bind(DefaultCanvasRectRender).toSelf().inSingletonScope(), bind(RectRender).to(DefaultCanvasRectRender), bind(GraphicRender).to(DefaultCanvasRectRender), bind(DefaultCanvasRect3dRender).toSelf().inSingletonScope(), bind(Rect3DRender).toService(DefaultCanvasRect3dRender), bind(GraphicRender).toService(Rect3DRender), bind(DefaultRectRenderContribution).toSelf().inSingletonScope(), bind(DefaultRectBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultRectTextureRenderContribution).toSelf().inSingletonScope(), bind(SplitRectBeforeRenderContribution).toSelf().inSingletonScope(), bind(SplitRectAfterRenderContribution).toSelf().inSingletonScope(), bind(RectRenderContribution).toService(DefaultRectRenderContribution), bind(RectRenderContribution).toService(DefaultRectBackgroundRenderContribution), bind(RectRenderContribution).toService(DefaultRectTextureRenderContribution), bind(RectRenderContribution).toService(SplitRectBeforeRenderContribution), bind(RectRenderContribution).toService(SplitRectAfterRenderContribution), bindContributionProvider(bind, RectRenderContribution), bind(DefaultCanvasTextRender).toSelf().inSingletonScope(), bind(TextRender).to(DefaultCanvasTextRender), bind(GraphicRender).to(DefaultCanvasTextRender), bindContributionProvider(bind, TextRenderContribution), bind(DefaultCanvasPathRender).toSelf().inSingletonScope(), bind(PathRender).to(DefaultCanvasPathRender), bind(GraphicRender).to(DefaultCanvasPathRender), bind(DefaultPathBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultPathTextureRenderContribution).toSelf().inSingletonScope(), bind(PathRenderContribution).toService(DefaultPathBackgroundRenderContribution), bind(PathRenderContribution).toService(DefaultPathTextureRenderContribution), bindContributionProvider(bind, PathRenderContribution), bind(DefaultCanvasSymbolRender).toSelf().inSingletonScope(), bind(SymbolRender).to(DefaultCanvasSymbolRender), bind(GraphicRender).to(DefaultCanvasSymbolRender), bind(DefaultSymbolRenderContribution).toSelf().inSingletonScope(), bind(DefaultSymbolBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultSymbolTextureRenderContribution).toSelf().inSingletonScope(), bind(SymbolRenderContribution).toService(DefaultSymbolRenderContribution), bind(SymbolRenderContribution).toService(DefaultSymbolBackgroundRenderContribution), bind(SymbolRenderContribution).toService(DefaultSymbolTextureRenderContribution), bindContributionProvider(bind, SymbolRenderContribution), bind(DefaultCanvasArcRender).toSelf().inSingletonScope(), bind(ArcRender).to(DefaultCanvasArcRender), bind(GraphicRender).to(DefaultCanvasArcRender), bind(DefaultCanvasArc3DRender).toSelf().inSingletonScope(), bind(Arc3dRender).toService(DefaultCanvasArc3DRender), bind(GraphicRender).toService(Arc3dRender), bind(DefaultArcRenderContribution).toSelf().inSingletonScope(), bind(DefaultArcBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultArcTextureRenderContribution).toSelf().inSingletonScope(), bind(ArcRenderContribution).toService(DefaultArcRenderContribution), bind(ArcRenderContribution).toService(DefaultArcBackgroundRenderContribution), bind(ArcRenderContribution).toService(DefaultArcTextureRenderContribution), bindContributionProvider(bind, ArcRenderContribution), bind(DefaultCanvasLineRender).toSelf().inSingletonScope(), bind(LineRender).to(DefaultCanvasLineRender), bind(GraphicRender).to(DefaultCanvasLineRender), bind(DefaultIncrementalCanvasLineRender).toSelf().inSingletonScope(), bind(DefaultIncrementalCanvasAreaRender).toSelf().inSingletonScope(), bind(DefaultCanvasAreaRender).toSelf().inSingletonScope(), bind(AreaRender).to(DefaultCanvasAreaRender), bind(GraphicRender).to(DefaultCanvasAreaRender), bind(DefaultAreaBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultAreaTextureRenderContribution).toSelf().inSingletonScope(), bind(AreaRenderContribution).toService(DefaultAreaBackgroundRenderContribution), bind(AreaRenderContribution).toService(DefaultAreaTextureRenderContribution), bindContributionProvider(bind, AreaRenderContribution), bind(DefaultCanvasGroupRender).toSelf().inSingletonScope(), bind(GroupRender).to(DefaultCanvasGroupRender), bind(GraphicRender).to(DefaultCanvasGroupRender), bind(DefaultGroupBackgroundRenderContribution).toSelf().inSingletonScope(), bind(GroupRenderContribution).toService(DefaultGroupBackgroundRenderContribution), bindContributionProvider(bind, GroupRenderContribution), bind(DefaultCanvasPolygonRender).toSelf().inSingletonScope(), bind(PolygonRender).to(DefaultCanvasPolygonRender), bind(GraphicRender).to(DefaultCanvasPolygonRender), bind(DefaultPolygonBackgroundRenderContribution).toSelf().inSingletonScope(), bind(DefaultPolygonTextureRenderContribution).toSelf().inSingletonScope(), bind(PolygonRenderContribution).toService(DefaultPolygonBackgroundRenderContribution), bind(PolygonRenderContribution).toService(DefaultPolygonTextureRenderContribution), bindContributionProvider(bind, PolygonRenderContribution), bind(DefaultCanvasGlyphRender).toSelf().inSingletonScope(), bind(GlyphRender).toService(DefaultCanvasGlyphRender), bind(GraphicRender).toService(GlyphRender), bind(DefaultCanvasImageRender).toSelf().inSingletonScope(), bind(ImageRender).toService(DefaultCanvasImageRender), bind(GraphicRender).toService(ImageRender), bind(DefaultImageBackgroundRenderContribution).toSelf().inSingletonScope(), bind(ImageRenderContribution).toService(DefaultImageBackgroundRenderContribution), bindContributionProvider(bind, ImageRenderContribution), bind(DefaultCanvasRichTextRender).toSelf().inSingletonScope(), bind(RichTextRender).toService(DefaultCanvasRichTextRender), bind(GraphicRender).toService(RichTextRender), bind(DefaultCanvasPyramid3dRender).toSelf().inSingletonScope(), bind(Pyramid3dRender).toService(DefaultCanvasPyramid3dRender), bind(GraphicRender).toService(Pyramid3dRender), bind(DefaultBaseInteractiveRenderContribution).toSelf().inSingletonScope(), bind(TextRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(ArcRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(PathRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(SymbolRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(RectRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(ImageRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(CircleRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(AreaRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bind(PolygonRenderContribution).toService(DefaultBaseInteractiveRenderContribution), bindContributionProvider(bind, InteractiveSubRenderContribution), bindContributionProvider(bind, GraphicRender), bind(ShadowRootDrawItemInterceptorContribution).toSelf().inSingletonScope(), bind(DrawItemInterceptor).toService(ShadowRootDrawItemInterceptorContribution), bind(Canvas3DDrawItemInterceptor).toSelf().inSingletonScope(), bind(DrawItemInterceptor).toService(Canvas3DDrawItemInterceptor), bindContributionProvider(bind, DrawItemInterceptor);
@@ -33191,7 +33246,7 @@
 	  container.load(renderModule);
 	}
 
-	var __decorate$p = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$r = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33234,9 +33289,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasCirclePicker = __decorate$p([injectable(), __param$m(0, inject(CircleRender)), __metadata$m("design:paramtypes", [Object])], DefaultCanvasCirclePicker);
+	DefaultCanvasCirclePicker = __decorate$r([injectable(), __param$m(0, inject(CircleRender)), __metadata$m("design:paramtypes", [Object])], DefaultCanvasCirclePicker);
 
-	var __decorate$o = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$q = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33296,9 +33351,9 @@
 	    return pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasRectPicker = __decorate$o([injectable(), __param$l(0, inject(RectRender)), __metadata$l("design:paramtypes", [Object])], DefaultCanvasRectPicker);
+	DefaultCanvasRectPicker = __decorate$q([injectable(), __param$l(0, inject(RectRender)), __metadata$l("design:paramtypes", [Object])], DefaultCanvasRectPicker);
 
-	var __decorate$n = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$p = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33342,9 +33397,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasArcPicker = __decorate$n([injectable(), __param$k(0, inject(ArcRender)), __metadata$k("design:paramtypes", [Object])], DefaultCanvasArcPicker);
+	DefaultCanvasArcPicker = __decorate$p([injectable(), __param$k(0, inject(ArcRender)), __metadata$k("design:paramtypes", [Object])], DefaultCanvasArcPicker);
 
-	var __decorate$m = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$o = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33383,9 +33438,9 @@
 	    return this.canvasRenderer.drawShape(area, pickContext, x, y, {}, null, context => !!picked || (picked = context.isPointInPath(point.x, point.y), picked)), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasAreaPicker = __decorate$m([injectable(), __param$j(0, inject(AreaRender)), __metadata$j("design:paramtypes", [Object])], DefaultCanvasAreaPicker);
+	DefaultCanvasAreaPicker = __decorate$o([injectable(), __param$j(0, inject(AreaRender)), __metadata$j("design:paramtypes", [Object])], DefaultCanvasAreaPicker);
 
-	var __decorate$l = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$n = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33403,9 +33458,9 @@
 	    return !!pickContext && !!image.AABBBounds.containsPoint(point);
 	  }
 	};
-	DefaultCanvasImagePicker = __decorate$l([injectable()], DefaultCanvasImagePicker);
+	DefaultCanvasImagePicker = __decorate$n([injectable()], DefaultCanvasImagePicker);
 
-	var __decorate$k = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$m = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33413,9 +33468,9 @@
 	  return c > 3 && r && Object.defineProperty(target, key, r), r;
 	};
 	let BasePicker = class extends BaseRender {};
-	BasePicker = __decorate$k([injectable()], BasePicker);
+	BasePicker = __decorate$m([injectable()], BasePicker);
 
-	var __decorate$j = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$l = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33465,9 +33520,9 @@
 	    }), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasLinePicker = __decorate$j([injectable(), __param$i(0, inject(LineRender)), __metadata$i("design:paramtypes", [Object])], DefaultCanvasLinePicker);
+	DefaultCanvasLinePicker = __decorate$l([injectable(), __param$i(0, inject(LineRender)), __metadata$i("design:paramtypes", [Object])], DefaultCanvasLinePicker);
 
-	var __decorate$i = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$k = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33517,9 +33572,9 @@
 	    }), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasPathPicker = __decorate$i([injectable(), __param$h(0, inject(PathRender)), __metadata$h("design:paramtypes", [Object])], DefaultCanvasPathPicker);
+	DefaultCanvasPathPicker = __decorate$k([injectable(), __param$h(0, inject(PathRender)), __metadata$h("design:paramtypes", [Object])], DefaultCanvasPathPicker);
 
-	var __decorate$h = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$j = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33571,9 +33626,9 @@
 	    }), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasSymbolPicker = __decorate$h([injectable(), __param$g(0, inject(SymbolRender)), __metadata$g("design:paramtypes", [Object])], DefaultCanvasSymbolPicker);
+	DefaultCanvasSymbolPicker = __decorate$j([injectable(), __param$g(0, inject(SymbolRender)), __metadata$g("design:paramtypes", [Object])], DefaultCanvasSymbolPicker);
 
-	var __decorate$g = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$i = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33636,9 +33691,9 @@
 	    }, (context, symbolAttribute, themeAttribute) => picked), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasTextPicker = __decorate$g([injectable(), __param$f(0, inject(TextRender)), __metadata$f("design:paramtypes", [Object])], DefaultCanvasTextPicker);
+	DefaultCanvasTextPicker = __decorate$i([injectable(), __param$f(0, inject(TextRender)), __metadata$f("design:paramtypes", [Object])], DefaultCanvasTextPicker);
 
-	var __decorate$f = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$h = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33680,9 +33735,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasPolygonPicker = __decorate$f([injectable(), __param$e(0, inject(PolygonRender)), __metadata$e("design:paramtypes", [Object])], DefaultCanvasPolygonPicker);
+	DefaultCanvasPolygonPicker = __decorate$h([injectable(), __param$e(0, inject(PolygonRender)), __metadata$e("design:paramtypes", [Object])], DefaultCanvasPolygonPicker);
 
-	var __decorate$e = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$g = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33706,9 +33761,9 @@
 	    return !!richtext.AABBBounds.containsPoint(point);
 	  }
 	};
-	DefaultCanvasRichTextPicker = __decorate$e([injectable(), __param$d(0, inject(RichTextRender)), __metadata$d("design:paramtypes", [Object])], DefaultCanvasRichTextPicker);
+	DefaultCanvasRichTextPicker = __decorate$g([injectable(), __param$d(0, inject(RichTextRender)), __metadata$d("design:paramtypes", [Object])], DefaultCanvasRichTextPicker);
 
-	var __decorate$d = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$f = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33744,9 +33799,9 @@
 	    return !1;
 	  }
 	};
-	DefaultCanvasGlyphPicker = __decorate$d([injectable(), __param$c(0, inject(GlyphRender)), __metadata$c("design:paramtypes", [Object])], DefaultCanvasGlyphPicker);
+	DefaultCanvasGlyphPicker = __decorate$f([injectable(), __param$c(0, inject(GlyphRender)), __metadata$c("design:paramtypes", [Object])], DefaultCanvasGlyphPicker);
 
-	var __decorate$c = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$e = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33791,9 +33846,9 @@
 	    return this.canvasRenderer.drawShape(rect, pickContext, x, y, params, null, (context, arc3dAttribute, themeAttribute) => !!picked || (picked = context.isPointInPath(pickPoint.x, pickPoint.y), picked)), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasRect3dPicker = __decorate$c([injectable(), __param$b(0, inject(Rect3DRender)), __metadata$b("design:paramtypes", [Object])], DefaultCanvasRect3dPicker);
+	DefaultCanvasRect3dPicker = __decorate$e([injectable(), __param$b(0, inject(Rect3DRender)), __metadata$b("design:paramtypes", [Object])], DefaultCanvasRect3dPicker);
 
-	var __decorate$b = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$d = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33838,9 +33893,9 @@
 	    return this.canvasRenderer.drawShape(pyramid3d, pickContext, x, y, {}, null, (context, pyramid3dAttribute, themeAttribute) => !!picked || (picked = context.isPointInPath(pickPoint.x, pickPoint.y), picked), (context, pyramid3dAttribute, themeAttribute) => !1), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasPyramid3dPicker = __decorate$b([injectable(), __param$a(0, inject(Pyramid3dRender)), __metadata$a("design:paramtypes", [Object])], DefaultCanvasPyramid3dPicker);
+	DefaultCanvasPyramid3dPicker = __decorate$d([injectable(), __param$a(0, inject(Pyramid3dRender)), __metadata$a("design:paramtypes", [Object])], DefaultCanvasPyramid3dPicker);
 
-	var __decorate$a = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$c = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33885,13 +33940,13 @@
 	    return this.canvasRenderer.drawShape(arc3d, pickContext, x, y, params, null, (context, arc3dAttribute, themeAttribute) => !!picked || (picked = context.isPointInPath(pickPoint.x, pickPoint.y), picked)), this.canvasRenderer.z = 0, pickContext.modelMatrix !== lastModelMatrix && mat4Allocate.free(pickContext.modelMatrix), pickContext.modelMatrix = lastModelMatrix, pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultCanvasArc3dPicker = __decorate$a([injectable(), __param$9(0, inject(Arc3dRender)), __metadata$9("design:paramtypes", [Object])], DefaultCanvasArc3dPicker);
+	DefaultCanvasArc3dPicker = __decorate$c([injectable(), __param$9(0, inject(Arc3dRender)), __metadata$9("design:paramtypes", [Object])], DefaultCanvasArc3dPicker);
 
 	var canvasPickModule = new ContainerModule((bind, unbind, isBound, rebind) => {
 	  bind(DefaultCanvasCirclePicker).toSelf().inSingletonScope(), bind(CanvasCirclePicker).toService(DefaultCanvasCirclePicker), bind(CanvasPickerContribution).toService(CanvasCirclePicker), bind(DefaultCanvasRectPicker).toSelf().inSingletonScope(), bind(CanvasRectPicker).toService(DefaultCanvasRectPicker), bind(CanvasPickerContribution).toService(CanvasRectPicker), bind(DefaultCanvasRect3dPicker).toSelf().inSingletonScope(), bind(CanvasRect3dPicker).toService(DefaultCanvasRect3dPicker), bind(CanvasPickerContribution).toService(CanvasRect3dPicker), bind(DefaultCanvasArcPicker).toSelf().inSingletonScope(), bind(CanvasArcPicker).toService(DefaultCanvasArcPicker), bind(CanvasPickerContribution).toService(CanvasArcPicker), bind(DefaultCanvasAreaPicker).toSelf().inSingletonScope(), bind(CanvasAreaPicker).toService(DefaultCanvasAreaPicker), bind(CanvasPickerContribution).toService(CanvasAreaPicker), bind(DefaultCanvasImagePicker).toSelf().inSingletonScope(), bind(CanvasImagePicker).toService(DefaultCanvasImagePicker), bind(CanvasPickerContribution).toService(CanvasImagePicker), bind(DefaultCanvasLinePicker).toSelf().inSingletonScope(), bind(CanvasLinePicker).toService(DefaultCanvasLinePicker), bind(CanvasPickerContribution).toService(CanvasLinePicker), bind(DefaultCanvasPathPicker).toSelf().inSingletonScope(), bind(CanvasPathPicker).toService(DefaultCanvasPathPicker), bind(CanvasPickerContribution).toService(CanvasPathPicker), bind(DefaultCanvasSymbolPicker).toSelf().inSingletonScope(), bind(CanvasSymbolPicker).toService(DefaultCanvasSymbolPicker), bind(CanvasPickerContribution).toService(CanvasSymbolPicker), bind(DefaultCanvasTextPicker).toSelf().inSingletonScope(), bind(CanvasTextPicker).toService(DefaultCanvasTextPicker), bind(CanvasPickerContribution).toService(CanvasTextPicker), bind(DefaultCanvasPolygonPicker).toSelf().inSingletonScope(), bind(CanvasPolygonPicker).toService(DefaultCanvasPolygonPicker), bind(CanvasPickerContribution).toService(CanvasPolygonPicker), bind(DefaultCanvasPyramid3dPicker).toSelf().inSingletonScope(), bind(CanvasPyramid3dPicker).toService(DefaultCanvasPyramid3dPicker), bind(CanvasPickerContribution).toService(CanvasPyramid3dPicker), bind(DefaultCanvasArc3dPicker).toSelf().inSingletonScope(), bind(CanvasArc3dPicker).toService(DefaultCanvasArc3dPicker), bind(CanvasPickerContribution).toService(CanvasArc3dPicker), bind(DefaultCanvasRichTextPicker).toSelf().inSingletonScope(), bind(CanvasRichTextPicker).toService(DefaultCanvasRichTextPicker), bind(CanvasPickerContribution).toService(CanvasRichTextPicker), bind(DefaultCanvasGlyphPicker).toSelf().inSingletonScope(), bind(CanvasGlyphPicker).toService(DefaultCanvasGlyphPicker), bind(CanvasPickerContribution).toService(CanvasGlyphPicker), bindContributionProvider(bind, CanvasPickerContribution);
 	});
 
-	var __decorate$9 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$b = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33934,9 +33989,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathPathPicker = __decorate$9([injectable(), __param$8(0, inject(PathRender)), __metadata$8("design:paramtypes", [Object])], DefaultMathPathPicker);
+	DefaultMathPathPicker = __decorate$b([injectable(), __param$8(0, inject(PathRender)), __metadata$8("design:paramtypes", [Object])], DefaultMathPathPicker);
 
-	var __decorate$8 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$a = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -33979,9 +34034,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathCirclePicker = __decorate$8([injectable(), __param$7(0, inject(CircleRender)), __metadata$7("design:paramtypes", [Object])], DefaultMathCirclePicker);
+	DefaultMathCirclePicker = __decorate$a([injectable(), __param$7(0, inject(CircleRender)), __metadata$7("design:paramtypes", [Object])], DefaultMathCirclePicker);
 
-	var __decorate$7 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$9 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34041,9 +34096,9 @@
 	    return pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathRectPicker = __decorate$7([injectable(), __param$6(0, inject(RectRender)), __metadata$6("design:paramtypes", [Object])], DefaultMathRectPicker);
+	DefaultMathRectPicker = __decorate$9([injectable(), __param$6(0, inject(RectRender)), __metadata$6("design:paramtypes", [Object])], DefaultMathRectPicker);
 
-	var __decorate$6 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$8 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34087,9 +34142,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathArcPicker = __decorate$6([injectable(), __param$5(0, inject(ArcRender)), __metadata$5("design:paramtypes", [Object])], DefaultMathArcPicker);
+	DefaultMathArcPicker = __decorate$8([injectable(), __param$5(0, inject(ArcRender)), __metadata$5("design:paramtypes", [Object])], DefaultMathArcPicker);
 
-	var __decorate$5 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$7 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34128,9 +34183,9 @@
 	    return this.canvasRenderer.drawShape(area, pickContext, x, y, {}, null, context => !!picked || (picked = context.isPointInPath(point.x, point.y), picked)), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathAreaPicker = __decorate$5([injectable(), __param$4(0, inject(AreaRender)), __metadata$4("design:paramtypes", [Object])], DefaultMathAreaPicker);
+	DefaultMathAreaPicker = __decorate$7([injectable(), __param$4(0, inject(AreaRender)), __metadata$4("design:paramtypes", [Object])], DefaultMathAreaPicker);
 
-	var __decorate$4 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$6 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34173,9 +34228,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathLinePicker = __decorate$4([injectable(), __param$3(0, inject(LineRender)), __metadata$3("design:paramtypes", [Object])], DefaultMathLinePicker);
+	DefaultMathLinePicker = __decorate$6([injectable(), __param$3(0, inject(LineRender)), __metadata$3("design:paramtypes", [Object])], DefaultMathLinePicker);
 
-	var __decorate$3 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$5 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34218,9 +34273,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathSymbolPicker = __decorate$3([injectable(), __param$2(0, inject(SymbolRender)), __metadata$2("design:paramtypes", [Object])], DefaultMathSymbolPicker);
+	DefaultMathSymbolPicker = __decorate$5([injectable(), __param$2(0, inject(SymbolRender)), __metadata$2("design:paramtypes", [Object])], DefaultMathSymbolPicker);
 
-	var __decorate$2 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$4 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	  var d,
 	    c = arguments.length,
 	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34235,9 +34290,9 @@
 	    return !!text.AABBBounds.containsPoint(point);
 	  }
 	};
-	DefaultMathTextPicker = __decorate$2([injectable()], DefaultMathTextPicker);
+	DefaultMathTextPicker = __decorate$4([injectable()], DefaultMathTextPicker);
 
-	var __decorate$1 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$3 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34279,9 +34334,9 @@
 	    }), pickContext.highPerformanceRestore(), picked;
 	  }
 	};
-	DefaultMathPolygonPicker = __decorate$1([injectable(), __param$1(0, inject(PolygonRender)), __metadata$1("design:paramtypes", [Object])], DefaultMathPolygonPicker);
+	DefaultMathPolygonPicker = __decorate$3([injectable(), __param$1(0, inject(PolygonRender)), __metadata$1("design:paramtypes", [Object])], DefaultMathPolygonPicker);
 
-	var __decorate = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	var __decorate$2 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
 	    var d,
 	      c = arguments.length,
 	      r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
@@ -34317,7 +34372,7 @@
 	    return !1;
 	  }
 	};
-	DefaultMathGlyphPicker = __decorate([injectable(), __param(0, inject(GlyphRender)), __metadata("design:paramtypes", [Object])], DefaultMathGlyphPicker);
+	DefaultMathGlyphPicker = __decorate$2([injectable(), __param(0, inject(GlyphRender)), __metadata("design:paramtypes", [Object])], DefaultMathGlyphPicker);
 
 	var mathPickModule = new ContainerModule(bind => {
 	  bind(DefaultMathCirclePicker).toSelf().inSingletonScope(), bind(MathCirclePicker).toService(DefaultMathCirclePicker), bind(MathPickerContribution).toService(MathCirclePicker), bind(DefaultMathRectPicker).toSelf().inSingletonScope(), bind(MathRectPicker).toService(DefaultMathRectPicker), bind(MathPickerContribution).toService(MathRectPicker), bind(DefaultMathArcPicker).toSelf().inSingletonScope(), bind(MathArcPicker).toService(DefaultMathArcPicker), bind(MathPickerContribution).toService(MathArcPicker), bind(DefaultMathAreaPicker).toSelf().inSingletonScope(), bind(MathAreaPicker).toService(DefaultMathAreaPicker), bind(MathPickerContribution).toService(MathAreaPicker), bind(DefaultMathLinePicker).toSelf().inSingletonScope(), bind(MathLinePicker).toService(DefaultMathLinePicker), bind(MathPickerContribution).toService(MathLinePicker), bind(DefaultMathPathPicker).toSelf().inSingletonScope(), bind(MathPathPicker).toService(DefaultMathPathPicker), bind(MathPickerContribution).toService(MathPathPicker), bind(DefaultMathSymbolPicker).toSelf().inSingletonScope(), bind(MathSymbolPicker).toService(DefaultMathSymbolPicker), bind(MathPickerContribution).toService(MathSymbolPicker), bind(DefaultMathTextPicker).toSelf().inSingletonScope(), bind(MathTextPicker).toService(DefaultMathTextPicker), bind(MathPickerContribution).toService(MathTextPicker), bind(DefaultMathPolygonPicker).toSelf().inSingletonScope(), bind(MathPolygonPicker).toService(DefaultMathPolygonPicker), bind(MathPickerContribution).toService(MathPolygonPicker), bind(DefaultMathGlyphPicker).toSelf().inSingletonScope(), bind(MathGlyphPicker).toService(DefaultMathGlyphPicker), bind(DefaultMathGlyphPicker).toService(MathGlyphPicker), bindContributionProvider(bind, MathPickerContribution);
@@ -40408,7 +40463,7 @@
 	  };
 	}
 
-	var __rest$5 = undefined && undefined.__rest || function (s, e) {
+	var __rest$6 = undefined && undefined.__rest || function (s, e) {
 	  var t = {};
 	  for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0 && (t[p] = s[p]);
 	  if (null != s && "function" == typeof Object.getOwnPropertySymbols) {
@@ -40449,7 +40504,7 @@
 	    const {
 	        visible: shapeVisible
 	      } = shape,
-	      shapeStyle = __rest$5(shape, ["visible"]);
+	      shapeStyle = __rest$6(shape, ["visible"]);
 	    if (isBoolean(shapeVisible)) {
 	      const size = (null == shapeStyle ? void 0 : shapeStyle.size) || 10,
 	        maxSize = isNumber(size) ? size : Math.max(size[0], size[1]);
@@ -40493,7 +40548,7 @@
 	    const {
 	        visible: bgVisible
 	      } = panel,
-	      backgroundStyle = __rest$5(panel, ["visible"]);
+	      backgroundStyle = __rest$6(panel, ["visible"]);
 	    if (visible && isBoolean(bgVisible)) {
 	      const bgRect = this.createOrUpdateChild("tag-panel", Object.assign(Object.assign({}, backgroundStyle), {
 	        visible: bgVisible && !!text,
@@ -40521,6 +40576,392 @@
 	  }
 	};
 
+	var __rest$5 = undefined && undefined.__rest || function (s, e) {
+	  var t = {};
+	  for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0 && (t[p] = s[p]);
+	  if (null != s && "function" == typeof Object.getOwnPropertySymbols) {
+	    var i = 0;
+	    for (p = Object.getOwnPropertySymbols(s); i < p.length; i++) e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]) && (t[p[i]] = s[p[i]]);
+	  }
+	  return t;
+	};
+	class PopTip extends AbstractComponent {
+	  constructor(attributes) {
+	    super(merge$2({}, PopTip.defaultAttributes, attributes)), this.name = "poptip", this.positionList = ["top", "tl", "tr", "bottom", "bl", "br", "left", "lt", "lb", "right", "rt", "rb"];
+	  }
+	  render() {
+	    var _a, _b, _c, _d, _e;
+	    const {
+	        title = "",
+	        titleStyle = {},
+	        position: position,
+	        content = "",
+	        contentStyle = {},
+	        panel = {},
+	        space = 4,
+	        minWidth = 0,
+	        maxWidth = 1 / 0,
+	        padding = 4,
+	        visible: visible,
+	        state: state,
+	        dx = 0,
+	        dy = 0
+	      } = this.attribute,
+	      parsedPadding = normalizePadding$1(padding),
+	      group = this.createOrUpdateChild("poptip-content", {
+	        x: 0,
+	        y: 0,
+	        zIndex: 1
+	      }, "group"),
+	      maxLineWidth = maxWidth - parsedPadding[1] - parsedPadding[3],
+	      titleVisible = isValid(title) && !1 !== visible,
+	      titleAttrs = Object.assign(Object.assign({
+	        text: title,
+	        visible: titleVisible
+	      }, titleStyle), {
+	        x: parsedPadding[3],
+	        y: parsedPadding[0],
+	        maxLineWidth: maxLineWidth,
+	        textAlign: "left",
+	        textBaseline: "top"
+	      }),
+	      titleShape = group.createOrUpdateChild("poptip-title", titleAttrs, "text");
+	    isEmpty(null == state ? void 0 : state.title) || (titleShape.states = state.title);
+	    const titleBounds = titleShape.AABBBounds,
+	      titleHeight = titleBounds.height(),
+	      titleWidth = titleBounds.width();
+	    let height = titleHeight + space;
+	    titleVisible || (height = 0);
+	    const contentVisible = isValid(content) && !1 !== visible,
+	      contentAttrs = Object.assign(Object.assign({
+	        text: content,
+	        visible: contentVisible
+	      }, contentStyle), {
+	        x: parsedPadding[3],
+	        y: parsedPadding[0] + height,
+	        maxLineWidth: maxLineWidth,
+	        textAlign: "left",
+	        textBaseline: "top"
+	      }),
+	      contentShape = group.createOrUpdateChild("poptip-content", contentAttrs, "text");
+	    isEmpty(null == state ? void 0 : state.content) || (contentShape.states = state.content);
+	    const contentBounds = contentShape.AABBBounds,
+	      contentHeight = contentBounds.height(),
+	      contentWidth = contentBounds.width();
+	    contentVisible && (height += contentHeight);
+	    let popTipWidth = max$3(titleWidth + parsedPadding[1] + parsedPadding[3], contentWidth + parsedPadding[1] + parsedPadding[3]);
+	    popTipWidth > maxWidth ? popTipWidth = maxWidth : popTipWidth < minWidth && (popTipWidth = minWidth);
+	    const poptipHeight = parsedPadding[0] + parsedPadding[2] + height,
+	      {
+	        visible: bgVisible
+	      } = panel,
+	      backgroundStyle = __rest$5(panel, ["visible"]),
+	      symbolSize = null !== (_a = backgroundStyle.size) && void 0 !== _a ? _a : 12,
+	      spaceSize = isArray$3(symbolSize) ? [symbolSize[0] + (null !== (_b = backgroundStyle.space) && void 0 !== _b ? _b : 0), symbolSize[1] + (null !== (_c = backgroundStyle.space) && void 0 !== _c ? _c : 0)] : symbolSize + (null !== (_d = backgroundStyle.space) && void 0 !== _d ? _d : 0),
+	      lineWidth = null !== (_e = backgroundStyle.lineWidth) && void 0 !== _e ? _e : 1,
+	      range = this.stage ? [this.stage.width, this.stage.height] : void 0,
+	      layout = "auto" === position;
+	    let minifyBBoxI,
+	      minifyBBoxSize = 1 / 0;
+	    for (let i = 0; i < this.positionList.length + 1; i++) {
+	      const p = layout ? this.positionList[i === this.positionList.length ? minifyBBoxI : i] : position,
+	        {
+	          angle: angle,
+	          offset: offset,
+	          rectOffset: rectOffset
+	        } = this.getAngleAndOffset(p, popTipWidth, poptipHeight, isArray$3(spaceSize) ? spaceSize : [spaceSize, spaceSize - lineWidth]);
+	      if (isBoolean(bgVisible)) {
+	        const offsetX = (isArray$3(symbolSize) ? symbolSize[0] : symbolSize) / 4,
+	          bgSymbol = group.createOrUpdateChild("poptip-symbol-panel", Object.assign(Object.assign({}, backgroundStyle), {
+	            visible: bgVisible && (contentVisible || titleVisible),
+	            x: offsetX,
+	            y: 0,
+	            strokeBoundsBuffer: -1,
+	            boundsPadding: -2,
+	            anchor: [0, 0],
+	            symbolType: "arrow2Left",
+	            angle: angle,
+	            dx: offset[0],
+	            dy: offset[1],
+	            size: symbolSize,
+	            zIndex: -9
+	          }), "symbol");
+	        isEmpty(null == state ? void 0 : state.panel) || (bgSymbol.states = state.panel);
+	        const bgRect = group.createOrUpdateChild("poptip-rect-panel", Object.assign(Object.assign({}, backgroundStyle), {
+	          visible: bgVisible && (contentVisible || titleVisible),
+	          x: 0,
+	          y: 0,
+	          width: popTipWidth,
+	          height: poptipHeight,
+	          zIndex: -8
+	        }), "rect");
+	        isEmpty(null == state ? void 0 : state.panel) || (bgRect.states = state.panel);
+	      }
+	      if (group.setAttributes({
+	        x: -offset[0] + dx,
+	        y: -offset[1] + dy
+	      }), !layout || !range) break;
+	      {
+	        const b = this.AABBBounds,
+	          stageBounds = new Bounds().setValue(0, 0, range[0], range[1]);
+	        if (rectInsideAnotherRect(b, stageBounds, !1)) break;
+	        {
+	          const bbox = getRectIntersect(b, stageBounds, !1),
+	            size = (bbox.x2 - bbox.x1) * (bbox.y2 - bbox.y1);
+	          size < minifyBBoxSize && (minifyBBoxSize = size, minifyBBoxI = i);
+	        }
+	      }
+	    }
+	  }
+	  getAngleAndOffset(position, width, height, size) {
+	    const sizeH = size[1] / 2;
+	    switch (position) {
+	      case "tl":
+	        return {
+	          angle: pi$1 / 2 * 3,
+	          offset: [width / 4, height + sizeH],
+	          rectOffset: [-width / 4, -height - size[1]]
+	        };
+	      case "top":
+	        return {
+	          angle: pi$1 / 2 * 3,
+	          offset: [width / 2, height + sizeH],
+	          rectOffset: [0, -height - size[1]]
+	        };
+	      case "tr":
+	        return {
+	          angle: pi$1 / 2 * 3,
+	          offset: [width / 4 * 3, height + sizeH],
+	          rectOffset: [width / 4 * 3, -height - size[1]]
+	        };
+	      case "rt":
+	        return {
+	          angle: 0,
+	          offset: [-sizeH, height / 5],
+	          rectOffset: [width / 4 * 3, -height - size[1]]
+	        };
+	      case "right":
+	        return {
+	          angle: 0,
+	          offset: [-sizeH, height / 2],
+	          rectOffset: [width / 4 * 3, -height - size[1]]
+	        };
+	      case "rb":
+	        return {
+	          angle: 0,
+	          offset: [-sizeH, height / 5 * 4],
+	          rectOffset: [width / 4 * 3, -height - size[1]]
+	        };
+	      case "bl":
+	        return {
+	          angle: pi$1 / 2,
+	          offset: [width / 4, -sizeH],
+	          rectOffset: [-width / 4, -height - size[1]]
+	        };
+	      case "bottom":
+	        return {
+	          angle: pi$1 / 2,
+	          offset: [width / 2, -sizeH],
+	          rectOffset: [0, -height - size[1]]
+	        };
+	      case "br":
+	        return {
+	          angle: pi$1 / 2,
+	          offset: [width / 4 * 3, -sizeH],
+	          rectOffset: [width / 4 * 3, -height - size[1]]
+	        };
+	      case "lt":
+	        return {
+	          angle: pi$1,
+	          offset: [width + sizeH, height / 5],
+	          rectOffset: [-width / 4, -height - size[1]]
+	        };
+	      case "left":
+	        return {
+	          angle: pi$1,
+	          offset: [width + sizeH, height / 2],
+	          rectOffset: [0, -height - size[1]]
+	        };
+	      case "lb":
+	        return {
+	          angle: pi$1,
+	          offset: [width + sizeH, height / 5 * 4],
+	          rectOffset: [width / 4 * 3, -height - size[1]]
+	        };
+	    }
+	  }
+	}
+	PopTip.defaultAttributes = {
+	  position: "rt",
+	  visible: !0,
+	  title: null,
+	  content: null,
+	  titleStyle: {
+	    fontSize: 12,
+	    fill: "#000",
+	    textAlign: "left",
+	    textBaseline: "top"
+	  },
+	  contentStyle: {
+	    fontSize: 12,
+	    fill: "#000",
+	    textAlign: "left",
+	    textBaseline: "top"
+	  },
+	  space: 8,
+	  padding: 10
+	};
+
+	const DEFAULT_THEME = {
+	  visible: !0,
+	  position: "auto",
+	  titleStyle: {
+	    fontSize: 16,
+	    fill: "#08979c"
+	  },
+	  contentStyle: {
+	    fontSize: 12,
+	    fill: "green"
+	  },
+	  panel: {
+	    visible: !0,
+	    fill: "#e6fffb",
+	    size: 12,
+	    space: 0,
+	    stroke: "#87e8de",
+	    lineWidth: 1,
+	    cornerRadius: 4
+	  }
+	};
+	const theme = {
+	  poptip: merge$2({}, DEFAULT_THEME)
+	};
+
+	var __decorate$1 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	  var d,
+	    c = arguments.length,
+	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+	  if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+	  return c > 3 && r && Object.defineProperty(target, key, r), r;
+	};
+	function wrapPoptip(target, source) {
+	  return merge$2(target, theme.poptip, source), target;
+	}
+	let PopTipRenderContribution = class {
+	  render(graphic, context, x, y, doFill, doStroke, fVisible, sVisible, graphicAttribute, drawContext, fillCb, strokeCb, options) {
+	    var _a;
+	    if (1 === graphic._showPoptip) {
+	      const {
+	        visible: visible,
+	        visibleCb: visibleCb
+	      } = graphic.attribute.poptip || {};
+	      if (!1 === visible || visibleCb && !1 === visibleCb(graphic)) return;
+	      this.poptipComponent || (this.poptipComponent = new PopTip(graphic.attribute.poptip));
+	      let poptip = graphic.attribute.poptip || {};
+	      if ("text" === graphic.type && null == poptip.title && null == poptip.content) {
+	        const out = {};
+	        wrapPoptip(out, poptip), poptip = out, poptip.content = null !== (_a = poptip.content) && void 0 !== _a ? _a : graphic.attribute.text;
+	      }
+	      const matrix = graphic.globalTransMatrix;
+	      this.poptipComponent.setAttributes(Object.assign(Object.assign({
+	        visibleAll: !0,
+	        pickable: !1,
+	        childrenPickable: !1
+	      }, poptip), {
+	        x: matrix.e,
+	        y: matrix.f
+	      }));
+	      const interactiveLayer = drawContext.stage.getLayer("_builtin_interactive");
+	      interactiveLayer && interactiveLayer.add(this.poptipComponent);
+	    } else 2 === graphic._showPoptip && (graphic._showPoptip = 0, this.poptipComponent && this.poptipComponent.setAttributes({
+	      visibleAll: !1
+	    }));
+	  }
+	};
+	PopTipRenderContribution = __decorate$1([injectable()], PopTipRenderContribution);
+
+	var __decorate = undefined && undefined.__decorate || function (decorators, target, key, desc) {
+	  var d,
+	    c = arguments.length,
+	    r = c < 3 ? target : null === desc ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
+	  if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
+	  return c > 3 && r && Object.defineProperty(target, key, r), r;
+	};
+	let PopTipPlugin = class {
+	  constructor() {
+	    this.name = "poptip", this.activeEvent = "onRegister", this._uid = Generator.GenAutoIncrementId(), this.key = this.name + this._uid, this.poptip = e => {
+	      const graphic = e.target;
+	      if (graphic.isContainer || !graphic.attribute) return void this.unpoptip(e);
+	      if (graphic === this.activeGraphic) return;
+	      const {
+	        poptip: poptip
+	      } = graphic.attribute;
+	      poptip && (graphic.setAttributes({}), graphic._showPoptip = 1), this.activeGraphic && (this.activeGraphic.setAttributes({}), this.activeGraphic._showPoptip = 2), this.setActiveGraphic(graphic, !0);
+	    }, this.unpoptip = e => {
+	      this.activeGraphic && (this.activeGraphic.setAttributes({}), this.activeGraphic._showPoptip = 2, this.setActiveGraphic(null, !0));
+	    };
+	  }
+	  activate(context) {
+	    this.pluginService = context;
+	    const {
+	      stage: stage
+	    } = this.pluginService;
+	    stage.addEventListener("pointerover", this.poptip);
+	  }
+	  setActiveGraphic(graphic, rerender) {
+	    this.activeGraphic = graphic, this.pluginService.stage.renderNextFrame();
+	  }
+	  deactivate(context) {
+	    const {
+	      stage: stage
+	    } = this.pluginService;
+	    stage.removeEventListener("pointerover", this.poptip);
+	  }
+	};
+	PopTipPlugin = __decorate([injectable()], PopTipPlugin);
+	let PopTipForClipedTextPlugin = class {
+	  constructor() {
+	    this.name = "poptipForText", this.activeEvent = "onRegister", this._uid = Generator.GenAutoIncrementId(), this.key = this.name + this._uid, this.poptip = e => {
+	      const graphic = e.target;
+	      if ("text" !== graphic.type || !graphic.cliped || graphic.isContainer || !graphic.attribute) return void this.unpoptip(e);
+	      if (graphic === this.activeGraphic) return;
+	      const {
+	        poptip = {}
+	      } = graphic.attribute;
+	      poptip && (graphic.setAttributes({}), graphic._showPoptip = 1), this.activeGraphic && (this.activeGraphic.setAttributes({}), this.activeGraphic._showPoptip = 2), this.setActiveGraphic(graphic, !0);
+	    }, this.unpoptip = e => {
+	      this.activeGraphic && (this.activeGraphic.setAttributes({}), this.activeGraphic._showPoptip = 2, this.setActiveGraphic(null, !0));
+	    };
+	  }
+	  activate(context) {
+	    this.pluginService = context;
+	    const {
+	      stage: stage
+	    } = this.pluginService;
+	    stage.addEventListener("pointerover", this.poptip);
+	  }
+	  setActiveGraphic(graphic, rerender) {
+	    this.activeGraphic = graphic, this.pluginService.stage.renderNextFrame();
+	  }
+	  deactivate(context) {
+	    const {
+	      stage: stage
+	    } = this.pluginService;
+	    stage.removeEventListener("pointerover", this.poptip);
+	  }
+	};
+	PopTipForClipedTextPlugin = __decorate([injectable()], PopTipForClipedTextPlugin);
+
+	const popTipModule = new ContainerModule(bind => {
+	  bind(PopTipRenderContribution).toSelf().inSingletonScope(), bind(InteractiveSubRenderContribution).toService(PopTipRenderContribution), bind(PopTipPlugin).toSelf().inSingletonScope(), bind(AutoEnablePlugins).toService(PopTipPlugin), bind(PopTipForClipedTextPlugin).toSelf().inSingletonScope(), bind(AutoEnablePlugins).toService(PopTipForClipedTextPlugin);
+	});
+	function loadPoptip(defaultPoptipTheme) {
+	  merge$2(theme.poptip, defaultPoptipTheme), container.load(popTipModule);
+	}
+	function setPoptipTheme(defaultPoptipTheme) {
+	  merge$2(theme.poptip, DEFAULT_THEME, defaultPoptipTheme);
+	}
+
 	class CrosshairBase extends AbstractComponent {
 	  constructor() {
 	    super(...arguments), this.name = "crosshair";
@@ -41838,36 +42279,42 @@
 	    }
 	  }
 	  renderTicks(container) {
-	    var _a;
 	    const tickLineItems = this.getTickLineItems(),
 	      tickLineGroup = createGroup({
 	        x: 0,
 	        y: 0,
 	        pickable: !1
 	      });
-	    tickLineGroup.name = AXIS_ELEMENT_NAME.tickContainer, tickLineGroup.id = this._getNodeId("tick-container"), container.add(tickLineGroup);
-	    const tickLineState = isEmpty(null === (_a = this.attribute.tick) || void 0 === _a ? void 0 : _a.state) ? null : merge$2({}, DEFAULT_STATES$2, this.attribute.tick.state);
-	    tickLineItems.forEach((item, index) => {
+	    tickLineGroup.name = AXIS_ELEMENT_NAME.tickContainer, tickLineGroup.id = this._getNodeId("tick-container"), container.add(tickLineGroup), tickLineItems.forEach((item, index) => {
+	      var _a;
 	      const line = createLine(Object.assign({}, this._getTickLineAttribute("tick", item, index, tickLineItems)));
-	      line.name = AXIS_ELEMENT_NAME.tick, line.id = this._getNodeId(item.id), line.states = tickLineState, tickLineGroup.add(line);
+	      if (line.name = AXIS_ELEMENT_NAME.tick, line.id = this._getNodeId(item.id), isEmpty(null === (_a = this.attribute.tick) || void 0 === _a ? void 0 : _a.state)) line.states = null;else {
+	        const data = this.data[index],
+	          tickLineState = merge$2({}, DEFAULT_STATES$2, this.attribute.tick.state);
+	        Object.keys(tickLineState).forEach(key => {
+	          isFunction(tickLineState[key]) && (tickLineState[key] = tickLineState[key](data.rawValue, index, data, this.data));
+	        }), line.states = tickLineState;
+	      }
+	      tickLineGroup.add(line);
 	    }), this.tickLineItems = tickLineItems;
 	    const {
 	      subTick: subTick
 	    } = this.attribute;
 	    if (null == subTick ? void 0 : subTick.visible) {
 	      const subTickLineItems = this.getSubTickLineItems();
-	      if (subTickLineItems.length) {
-	        const subTickLineState = isEmpty(subTick.state) ? null : merge$2({}, DEFAULT_STATES$2, subTick.state);
-	        subTickLineItems.forEach((item, index) => {
-	          const line = createLine(Object.assign({}, this._getTickLineAttribute("subTick", item, index, tickLineItems)));
-	          line.name = AXIS_ELEMENT_NAME.subTick, line.id = this._getNodeId(`${index}`), line.states = subTickLineState, tickLineGroup.add(line);
-	        });
-	      }
-	      this.subTickLineItems = subTickLineItems;
+	      subTickLineItems.length && subTickLineItems.forEach((item, index) => {
+	        const line = createLine(Object.assign({}, this._getTickLineAttribute("subTick", item, index, tickLineItems)));
+	        if (line.name = AXIS_ELEMENT_NAME.subTick, line.id = this._getNodeId(`${index}`), isEmpty(subTick.state)) line.states = null;else {
+	          const subTickLineState = merge$2({}, DEFAULT_STATES$2, subTick.state);
+	          Object.keys(subTickLineState).forEach(key => {
+	            isFunction(subTickLineState[key]) && (subTickLineState[key] = subTickLineState[key](item.value, index, item, tickLineItems));
+	          }), line.states = subTickLineState;
+	        }
+	        tickLineGroup.add(line);
+	      }), this.subTickLineItems = subTickLineItems;
 	    }
 	  }
 	  renderLabels(container, items, layer) {
-	    var _a;
 	    const {
 	      dataFilter: dataFilter
 	    } = this.attribute.label;
@@ -41883,13 +42330,18 @@
 	      maxTextHeight = 0,
 	      textAlign = "center",
 	      textBaseline = "middle";
-	    const labelState = isEmpty(null === (_a = this.attribute.label) || void 0 === _a ? void 0 : _a.state) ? null : merge$2({}, DEFAULT_STATES$2, this.attribute.label.state);
 	    return data.forEach((item, index) => {
-	      var _a;
+	      var _a, _b;
 	      const labelStyle = this._getLabelAttribute(item, index, data, layer),
 	        text = createText(labelStyle);
-	      text.name = AXIS_ELEMENT_NAME.label, text.id = this._getNodeId(`layer${layer}-label-${item.id}`), text.states = labelState, labelGroup.add(text);
-	      const angle = null !== (_a = labelStyle.angle) && void 0 !== _a ? _a : 0;
+	      if (text.name = AXIS_ELEMENT_NAME.label, text.id = this._getNodeId(`layer${layer}-label-${item.id}`), isEmpty(null === (_a = this.attribute.label) || void 0 === _a ? void 0 : _a.state)) text.states = null;else {
+	        const labelState = merge$2({}, DEFAULT_STATES$2, this.attribute.label.state);
+	        Object.keys(labelState).forEach(key => {
+	          isFunction(labelState[key]) && (labelState[key] = labelState[key](item, index, data, layer));
+	        }), text.states = labelState;
+	      }
+	      labelGroup.add(text);
+	      const angle = null !== (_b = labelStyle.angle) && void 0 !== _b ? _b : 0;
 	      maxTextWidth = Math.max(maxTextWidth, text.AABBBounds.width()), maxTextHeight = Math.max(maxTextHeight, text.AABBBounds.height()), angle && (maxTextWidth = Math.abs(maxTextWidth * Math.cos(angle)), maxTextHeight = Math.abs(maxTextHeight * Math.sin(angle))), textAlign = labelStyle.textAlign, textBaseline = labelStyle.textBaseline;
 	    }), this.axisLabelLayerSize[layer] = {
 	      width: maxTextWidth,
@@ -42202,7 +42654,7 @@
 	    orient: orient
 	  } = config;
 	  !isEmpty(labels) && isValidNumber(limitLength) && labels.forEach(label => {
-	    const limitLabelLength = 0 === label.attribute.angle || isNil(label.attribute.angle) ? "top" === orient || "bottom" === orient ? null : limitLength : limitLength / Math.sin(label.attribute.angle);
+	    const limitLabelLength = 0 === label.attribute.angle || isNil(label.attribute.angle) ? "top" === orient || "bottom" === orient ? null : limitLength : Math.abs(limitLength / Math.sin(label.attribute.angle));
 	    label.setAttributes({
 	      maxLineWidth: limitLabelLength,
 	      ellipsis: ellipsis
@@ -42912,7 +43364,7 @@
 	    }
 	  },
 	  middleHandlerStyle: {
-	    visible: !1,
+	    visible: !0,
 	    background: {
 	      size: 8,
 	      style: {
@@ -42930,12 +43382,14 @@
 	    }
 	  },
 	  startHandlerStyle: {
+	    visible: !0,
 	    symbolType: "M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z",
 	    fill: "white",
 	    stroke: "#B0C8F9",
 	    lineWidth: .5
 	  },
 	  endHandlerStyle: {
+	    visible: !0,
 	    symbolType: "M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z",
 	    fill: "white",
 	    stroke: "#B0C8F9",
@@ -43179,13 +43633,15 @@
 	    }), `data-zoom-end-text-${position}`));
 	  }
 	  getLayoutAttrFromConfig() {
-	    var _a, _b;
+	    var _a, _b, _c, _d;
 	    if (this._layoutAttrFromConfig) return this._layoutAttrFromConfig;
 	    const {
 	        position: positionConfig,
 	        size: size,
 	        orient: orient,
-	        middleHandlerStyle: middleHandlerStyle
+	        middleHandlerStyle: middleHandlerStyle,
+	        startHandlerStyle: startHandlerStyle,
+	        endHandlerStyle: endHandlerStyle
 	      } = this.attribute,
 	      {
 	        width: widthConfig,
@@ -43193,13 +43649,22 @@
 	      } = size,
 	      middleHandlerSize = null !== (_b = null === (_a = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _a ? void 0 : _a.size) && void 0 !== _b ? _b : 10;
 	    let width, height, position;
-	    return (null == middleHandlerStyle ? void 0 : middleHandlerStyle.visible) ? this._isHorizontal ? (width = widthConfig, height = heightConfig - middleHandlerSize, position = {
+	    (null == middleHandlerStyle ? void 0 : middleHandlerStyle.visible) ? this._isHorizontal ? (width = widthConfig, height = heightConfig - middleHandlerSize, position = {
 	      x: positionConfig.x,
 	      y: positionConfig.y + middleHandlerSize
 	    }) : (width = widthConfig - middleHandlerSize, height = heightConfig, position = {
 	      x: positionConfig.x + ("left" === orient ? middleHandlerSize : 0),
 	      y: positionConfig.y
-	    }) : (width = widthConfig, height = heightConfig, position = positionConfig), this._layoutAttrFromConfig = {
+	    }) : (width = widthConfig, height = heightConfig, position = positionConfig);
+	    const startHandlerSize = null !== (_c = null == startHandlerStyle ? void 0 : startHandlerStyle.size) && void 0 !== _c ? _c : this._isHorizontal ? height : width,
+	      endHandlerSize = null !== (_d = null == endHandlerStyle ? void 0 : endHandlerStyle.size) && void 0 !== _d ? _d : this._isHorizontal ? height : width;
+	    return (null == startHandlerStyle ? void 0 : startHandlerStyle.visible) && (this._isHorizontal ? (width -= (startHandlerSize + endHandlerSize) / 2, position = {
+	      x: position.x + startHandlerSize / 2,
+	      y: position.y
+	    }) : (height -= (startHandlerSize + endHandlerSize) / 2, position = {
+	      x: position.x,
+	      y: position.y + startHandlerSize
+	    })), this._layoutAttrFromConfig = {
 	      position: position,
 	      width: width,
 	      height: height
@@ -43396,19 +43861,17 @@
 	      curveType: "basis"
 	    }, "area");
 	    const {
-	        position: position,
-	        size: size,
 	        selectedBackgroundChartStyle: selectedBackgroundChartStyle
 	      } = this.attribute,
-	      {
-	        width: width,
-	        height: height
-	      } = size,
 	      {
 	        start: start,
 	        end: end
-	      } = this.state;
-	      this.computeBasePoints();
+	      } = this.state,
+	      {
+	        position: position,
+	        width: width,
+	        height: height
+	      } = this.getLayoutAttrFromConfig();
 	    this._selectedPreviewGroupClip.setAttributes({
 	      x: this._isHorizontal ? position.x + start * width : position.x,
 	      y: this._isHorizontal ? position.y : position.y + start * height,
@@ -44370,7 +44833,7 @@
 	      pages = 1;
 	    legendItems.forEach((item, index) => {
 	      item.id || (item.id = item.label), item.index = index;
-	      const itemGroup = this._renderEachItem(item, !!isEmpty(defaultSelected) || (null == defaultSelected ? void 0 : defaultSelected.includes(item.label)), index),
+	      const itemGroup = this._renderEachItem(item, !!isEmpty(defaultSelected) || (null == defaultSelected ? void 0 : defaultSelected.includes(item.label)), index, legendItems),
 	        itemWidth = itemGroup.attribute.width,
 	        itemHeight = itemGroup.attribute.height;
 	      this._itemHeight = Math.max(this._itemHeight, itemHeight), maxWidthInCol = Math.max(itemWidth, maxWidthInCol), this._itemMaxWidth = Math.max(itemWidth, this._itemMaxWidth), isHorizontal ? (maxPages = maxRow, isValid(maxWidth) && (itemWidth >= maxWidth ? (doWrap = !0, index > 0 && (startX = 0, startY += itemHeight + spaceRow, pages += 1)) : maxWidth < startX + itemWidth && (doWrap = !0, startX = 0, startY += itemHeight + spaceRow, pages += 1)), index > 0 && itemGroup.setAttributes({
@@ -44392,7 +44855,7 @@
 	    } = this.attribute;
 	    hover && (this._itemsContainer.addEventListener("pointermove", this._onHover), this._itemsContainer.addEventListener("pointerout", this._onUnHover)), select && this._itemsContainer.addEventListener("pointerdown", this._onClick);
 	  }
-	  _renderEachItem(item, isSelected, index) {
+	  _renderEachItem(item, isSelected, index, items) {
 	    const {
 	        id: id,
 	        label: label,
@@ -44400,20 +44863,23 @@
 	        shape: shape
 	      } = item,
 	      {
-	        shape: shapeAttr = {},
-	        label: labelAttr = {},
-	        value: valueAttr = {},
 	        padding = 0,
-	        background: background,
 	        focus: focus,
 	        focusIconStyle = {}
-	      } = this.attribute.item,
-	      parsedPadding = normalizePadding$1(padding);
+	      } = this.attribute.item;
+	    let {
+	      shape: shapeAttr = {},
+	      label: labelAttr = {},
+	      value: valueAttr = {},
+	      background = {}
+	    } = this.attribute.item;
+	    shapeAttr = this._handleStyle(shapeAttr, item, isSelected, index, items), labelAttr = this._handleStyle(labelAttr, item, isSelected, index, items), valueAttr = this._handleStyle(valueAttr, item, isSelected, index, items), background = this._handleStyle(background, item, isSelected, index, items);
+	    const parsedPadding = normalizePadding$1(padding);
 	    let itemGroup;
 	    !1 === background.visible ? (itemGroup = createGroup({
 	      x: 0,
 	      y: 0,
-	      cursor: null == background ? void 0 : background.style.cursor
+	      cursor: (null == background ? void 0 : background.style).cursor
 	    }), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup)) : (itemGroup = createGroup(Object.assign({
 	      x: 0,
 	      y: 0
@@ -44456,7 +44922,7 @@
 	      y: 0,
 	      textAlign: "start",
 	      textBaseline: "middle",
-	      lineHeight: null == labelAttr ? void 0 : labelAttr.style.fontSize
+	      lineHeight: (null == labelAttr ? void 0 : labelAttr.style).fontSize
 	    }, null == labelAttr ? void 0 : labelAttr.style), {
 	      text: labelAttr.formatMethod ? labelAttr.formatMethod(label, item, index) : label
 	    }));
@@ -44469,7 +44935,7 @@
 	          y: 0,
 	          textAlign: "start",
 	          textBaseline: "middle",
-	          lineHeight: null == valueAttr ? void 0 : valueAttr.style.fontSize
+	          lineHeight: (null == valueAttr ? void 0 : valueAttr.style).fontSize
 	        }, null == valueAttr ? void 0 : valueAttr.style), {
 	          text: valueAttr.formatMethod ? valueAttr.formatMethod(value, item, index) : value
 	        }));
@@ -44619,6 +45085,12 @@
 	      });
 	    changeEvent.manager = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.eventSystem.manager, this.dispatchEvent(changeEvent);
 	  }
+	  _handleStyle(config, item, isSelected, index, items) {
+	    const newConfig = merge$2({}, config);
+	    return config.style && isFunction(config.style) && (newConfig.style = config.style(item, isSelected, index, items)), config.state && Object.keys(config.state).forEach(key => {
+	      config.state[key] && isFunction(config.state[key]) && (newConfig.state[key] = config.state[key](item, isSelected, index, items));
+	    }), newConfig;
+	  }
 	};
 	DiscreteLegend$1.defaultAttributes = {
 	  layout: "horizontal",
@@ -51640,9 +52112,9 @@
 	const dataZoom = {
 	    showDetail: 'auto',
 	    middleHandler: {
-	        visible: false,
+	        visible: true,
 	        background: {
-	            size: 5,
+	            size: 6,
 	            style: {
 	                stroke: '#D1D5DA',
 	                cornerRadius: 2
@@ -51650,7 +52122,7 @@
 	        },
 	        icon: {
 	            style: {
-	                size: 8,
+	                size: 4,
 	                fill: 'white',
 	                stroke: '#D1D5DA',
 	                symbolType: 'M 0.3 -0.5 C 0.41 -0.5 0.5 -0.41 0.5 -0.3 C 0.5 -0.3 0.5 0.3 0.5 0.3 C 0.5 0.41 0.41 0.5 0.3 0.5 C 0.3 0.5 -0.3 0.5 -0.3 0.5 C -0.41 0.5 -0.5 0.41 -0.5 0.3 C -0.5 0.3 -0.5 -0.3 -0.5 -0.3 C -0.5 -0.41 -0.41 -0.5 -0.3 -0.5 C -0.3 -0.5 0.3 -0.5 0.3 -0.5 Z',
@@ -52206,6 +52678,34 @@
 	    }
 	};
 
+	const poptip = {
+	    visible: true,
+	    position: 'auto',
+	    padding: 8,
+	    titleStyle: {
+	        fontSize: 12,
+	        fontWeight: 'bold',
+	        fill: '#4E5969'
+	    },
+	    contentStyle: {
+	        fontSize: 12,
+	        fill: '#4E5969'
+	    },
+	    panel: {
+	        visible: true,
+	        fill: '#fff',
+	        stroke: '#ffffff',
+	        lineWidth: 0,
+	        cornerRadius: 3,
+	        shadowBlur: 12,
+	        shadowOffsetX: 0,
+	        shadowOffsetY: 4,
+	        shadowColor: 'rgba(0, 0, 0, 0.1)',
+	        size: 0,
+	        space: 12
+	    }
+	};
+
 	const component = {
 	    discreteLegend,
 	    colorLegend,
@@ -52227,7 +52727,8 @@
 	    brush,
 	    indicator,
 	    title,
-	    mapLabel
+	    mapLabel,
+	    poptip
 	};
 
 	const lightTheme = {
@@ -52415,28 +52916,60 @@
 	};
 
 	function transformComponentStyle(cfg = {}) {
-	    if (!isEmpty(cfg.style)) {
-	        cfg.style = transformToGraphic(cfg.style);
+	    const newConfig = {
+	        ...cfg
+	    };
+	    if (isFunction(cfg.style)) {
+	        newConfig.style = (item, isSelected, index, allItems) => transformToGraphic(cfg.style(item, isSelected, index, allItems));
+	    }
+	    else if (!isEmpty(cfg.style)) {
+	        newConfig.style = transformToGraphic(cfg.style);
 	    }
 	    if (!isEmpty(cfg.state)) {
+	        const newStateStyle = {};
 	        Object.keys(cfg.state).forEach(key => {
-	            if (!isEmpty(cfg.state[key])) {
-	                cfg.state[key] = transformToGraphic(cfg.state[key]);
+	            if (isFunction(cfg.state[key])) {
+	                newStateStyle[key] = (item, isSelected, index, allItems) => transformToGraphic(cfg.state[key](item, isSelected, index, allItems));
+	            }
+	            else if (!isEmpty(cfg.state[key])) {
+	                newStateStyle[key] = transformToGraphic(cfg.state[key]);
 	            }
 	        });
+	        newConfig.state = newStateStyle;
 	    }
-	    return cfg;
+	    return newConfig;
 	}
 	function transformStateStyle(stateStyle) {
 	    if (isEmpty(stateStyle)) {
 	        return null;
 	    }
+	    const newStateStyle = {};
 	    Object.keys(stateStyle).forEach(key => {
-	        if (!isEmpty(stateStyle[key])) {
-	            stateStyle[key] = transformToGraphic(stateStyle[key]);
+	        if (isFunction(stateStyle[key])) {
+	            newStateStyle[key] = (value, index, datum, data) => transformToGraphic(stateStyle[key](value, index, datum, data));
+	        }
+	        else if (!isEmpty(stateStyle[key])) {
+	            newStateStyle[key] = transformToGraphic(stateStyle[key]);
 	        }
 	    });
-	    return stateStyle;
+	    return newStateStyle;
+	}
+	function transformAxisLabelStateStyle(stateStyle) {
+	    if (isEmpty(stateStyle)) {
+	        return null;
+	    }
+	    const newStateStyle = {};
+	    Object.keys(stateStyle).forEach(key => {
+	        if (isFunction(stateStyle[key])) {
+	            newStateStyle[key] = (datum, index, data, layer) => {
+	                return transformToGraphic(stateStyle[key](datum.rawValue, index, datum, data, layer));
+	            };
+	        }
+	        else if (!isEmpty(stateStyle[key])) {
+	            newStateStyle[key] = transformToGraphic(stateStyle[key]);
+	        }
+	    });
+	    return newStateStyle;
 	}
 	function transformToGraphic(style) {
 	    if (isEmpty(style)) {
@@ -52457,6 +52990,7 @@
 	    MarkTypeEnum["text"] = "text";
 	    MarkTypeEnum["rect"] = "rect";
 	    MarkTypeEnum["rect3d"] = "rect3d";
+	    MarkTypeEnum["image"] = "image";
 	    MarkTypeEnum["path"] = "path";
 	    MarkTypeEnum["area"] = "area";
 	    MarkTypeEnum["arc"] = "arc";
@@ -54052,7 +54586,7 @@
 	    _context = {};
 	    constructor(spec, options) {
 	        this._option = merge$2(this._option, options);
-	        const { dom, renderCanvas, mode, stage, ...restOptions } = this._option;
+	        const { dom, renderCanvas, mode, stage, poptip, ...restOptions } = this._option;
 	        if (dom) {
 	            this._container = isString(dom) ? document?.getElementById(dom) : dom;
 	        }
@@ -54076,6 +54610,7 @@
 	        }, {
 	            mode: this._option.mode,
 	            stage,
+	            pluginList: poptip !== false ? ['poptipForText'] : [],
 	            ...restOptions,
 	            background: spec.background || this._currentTheme.background || this._option.background
 	        });
@@ -54432,6 +54967,7 @@
 	        else {
 	            this._currentTheme = merge$2({}, ThemeManager.getTheme(this._currentThemeName), this._spec?.theme ?? {});
 	        }
+	        setPoptipTheme(merge$2({}, this._currentTheme.component?.poptip));
 	    }
 	    getCurrentTheme() {
 	        return this._currentTheme;
@@ -56097,6 +56633,7 @@
 	        this._rightCurrent = chartLayoutRect.x + chartLayoutRect.width;
 	        this._bottomCurrent = chartLayoutRect.height + chartLayoutRect.y;
 	        items.sort((a, b) => b.layoutLevel - a.layoutLevel);
+	        this.layoutNormalInlineItems(items.filter(x => x.layoutType === 'normal-inline'));
 	        this.layoutNormalItems(items.filter(x => x.layoutType === 'normal'));
 	        const layoutTemp = {
 	            _leftCurrent: this._leftCurrent,
@@ -56154,6 +56691,118 @@
 	            }
 	        });
 	    }
+	    layoutNormalInlineItems(normalItems) {
+	        const leftItems = normalItems.filter(item => item.layoutOrient === 'left');
+	        const rightItems = normalItems.filter(item => item.layoutOrient === 'right');
+	        const topItems = normalItems.filter(item => item.layoutOrient === 'top');
+	        const bottomItems = normalItems.filter(item => item.layoutOrient === 'bottom');
+	        const limitWidth = this._chartLayoutRect.width + this._chartLayoutRect.x;
+	        const limitHeight = this._chartLayoutRect.height + this._chartLayoutRect.y;
+	        let maxWidth = 0;
+	        let preLeft = this._leftCurrent;
+	        let preTop = this._topCurrent;
+	        leftItems.forEach((item, index) => {
+	            const layoutRect = this.getItemComputeLayoutRect(item);
+	            const rect = item.computeBoundsInRect(layoutRect);
+	            item.setLayoutRect(rect);
+	            const itemTotalHeight = rect.height + item.layoutPaddingTop + item.layoutPaddingBottom;
+	            const itemTotalWidth = rect.width + item.layoutPaddingLeft + item.layoutPaddingRight;
+	            item.setLayoutStartPosition({
+	                x: preLeft + item.layoutOffsetX + item.layoutPaddingLeft,
+	                y: preTop + item.layoutOffsetY + item.layoutPaddingTop
+	            });
+	            maxWidth = Math.max(maxWidth, itemTotalWidth);
+	            preTop += itemTotalHeight;
+	            if (preTop > limitHeight) {
+	                preLeft += maxWidth;
+	                maxWidth = itemTotalWidth;
+	                preTop = this._topCurrent + itemTotalHeight;
+	                item.setLayoutStartPosition({
+	                    x: preLeft + item.layoutOffsetX + item.layoutPaddingLeft,
+	                    y: this._topCurrent + item.layoutOffsetY + item.layoutPaddingTop
+	                });
+	            }
+	        });
+	        this._leftCurrent = preLeft + maxWidth;
+	        let maxHeight = 0;
+	        preLeft = this._leftCurrent;
+	        preTop = this._topCurrent;
+	        topItems.forEach((item, index) => {
+	            const layoutRect = this.getItemComputeLayoutRect(item);
+	            const rect = item.computeBoundsInRect(layoutRect);
+	            item.setLayoutRect(rect);
+	            const itemTotalHeight = rect.height + item.layoutPaddingTop + item.layoutPaddingBottom;
+	            const itemTotalWidth = rect.width + item.layoutPaddingLeft + item.layoutPaddingRight;
+	            item.setLayoutStartPosition({
+	                x: preLeft + item.layoutOffsetX + item.layoutPaddingLeft,
+	                y: preTop + item.layoutOffsetY + item.layoutPaddingTop
+	            });
+	            maxHeight = Math.max(maxHeight, itemTotalHeight);
+	            preLeft += itemTotalWidth;
+	            if (preLeft > limitWidth) {
+	                preLeft = this._leftCurrent + itemTotalWidth;
+	                preTop += maxHeight;
+	                maxHeight = itemTotalHeight;
+	                item.setLayoutStartPosition({
+	                    x: this._leftCurrent + item.layoutOffsetX + item.layoutPaddingLeft,
+	                    y: preTop + item.layoutOffsetY + item.layoutPaddingTop
+	                });
+	            }
+	        });
+	        this._topCurrent = preTop + maxHeight;
+	        maxWidth = 0;
+	        let preRight = this._rightCurrent;
+	        preTop = this._topCurrent;
+	        rightItems.forEach((item, index) => {
+	            const layoutRect = this.getItemComputeLayoutRect(item);
+	            const rect = item.computeBoundsInRect(layoutRect);
+	            item.setLayoutRect(rect);
+	            const itemTotalHeight = rect.height + item.layoutPaddingTop + item.layoutPaddingBottom;
+	            const itemTotalWidth = rect.width + item.layoutPaddingLeft + item.layoutPaddingRight;
+	            item.setLayoutStartPosition({
+	                x: preRight + item.layoutOffsetX - rect.width - item.layoutPaddingRight,
+	                y: preTop + item.layoutOffsetY + item.layoutPaddingTop
+	            });
+	            maxWidth = Math.max(maxWidth, itemTotalWidth);
+	            preTop += itemTotalHeight;
+	            if (preTop > limitHeight) {
+	                preRight -= maxWidth;
+	                maxWidth = itemTotalWidth;
+	                preTop = this._topCurrent + itemTotalHeight;
+	                item.setLayoutStartPosition({
+	                    x: preRight + item.layoutOffsetX - rect.width - item.layoutPaddingRight,
+	                    y: this._topCurrent + item.layoutOffsetY + item.layoutPaddingTop
+	                });
+	            }
+	        });
+	        this._rightCurrent = preRight - maxWidth;
+	        maxHeight = 0;
+	        preLeft = this._leftCurrent;
+	        let preBottom = this._bottomCurrent;
+	        bottomItems.forEach((item, index) => {
+	            const layoutRect = this.getItemComputeLayoutRect(item);
+	            const rect = item.computeBoundsInRect(layoutRect);
+	            item.setLayoutRect(rect);
+	            const itemTotalHeight = rect.height + item.layoutPaddingTop + item.layoutPaddingBottom;
+	            const itemTotalWidth = rect.width + item.layoutPaddingLeft + item.layoutPaddingRight;
+	            item.setLayoutStartPosition({
+	                x: preLeft + item.layoutOffsetX + item.layoutPaddingLeft,
+	                y: preBottom + item.layoutOffsetY - rect.height - item.layoutPaddingBottom
+	            });
+	            maxHeight = Math.max(maxHeight, itemTotalHeight);
+	            preLeft += itemTotalWidth;
+	            if (preLeft > limitWidth) {
+	                preLeft = this._leftCurrent + itemTotalWidth;
+	                preBottom -= maxHeight;
+	                maxHeight = itemTotalHeight;
+	                item.setLayoutStartPosition({
+	                    x: this._leftCurrent + item.layoutOffsetX + item.layoutPaddingLeft,
+	                    y: preBottom + item.layoutOffsetY - rect.height - item.layoutPaddingBottom
+	                });
+	            }
+	        });
+	        this._bottomCurrent = preBottom - maxHeight;
+	    }
 	    layoutRegionItems(regionItems, regionRelativeItems) {
 	        let regionRelativeTotalWidth = this._rightCurrent - this._leftCurrent;
 	        let regionRelativeTotalHeight = this._bottomCurrent - this._topCurrent;
@@ -57304,10 +57953,24 @@
 	    }
 	}
 
-	VChart.useMark([ComponentMark, GroupMark]);
+	class ImageMark extends BaseMark {
+	    static type = MarkTypeEnum.image;
+	    type = ImageMark.type;
+	    _getDefaultStyle() {
+	        const defaultStyle = {
+	            ...super._getDefaultStyle(),
+	            width: undefined,
+	            height: undefined,
+	            lineWidth: 0
+	        };
+	        return defaultStyle;
+	    }
+	}
+
+	VChart.useMark([ComponentMark, GroupMark, ImageMark]);
 	Factory.registerRegion('region', Region);
 	Factory.registerLayout('base', Layout);
-	const version = "1.1.0-beta.9";
+	const version = "1.1.0";
 	Logger.getInstance(LoggerLevel.Error);
 
 	var SeriesMarkNameEnum;
@@ -60865,7 +61528,7 @@
 	    getStatisticFields() {
 	        const fields = [];
 	        if (this.getXAxisHelper()?.getScale) {
-	            this._fieldX.forEach(f => {
+	            (this._fieldX2 ? [...this._fieldX, this._fieldX2] : this._fieldX).forEach(f => {
 	                const result = { key: f, operations: [] };
 	                if (isContinuous(this.getXAxisHelper().getScale(0).type)) {
 	                    result.operations = ['max', 'min'];
@@ -60877,7 +61540,7 @@
 	            });
 	        }
 	        if (this.getYAxisHelper()?.getScale) {
-	            this._fieldY.forEach(f => {
+	            (this._fieldY2 ? [...this._fieldY, this._fieldY2] : this._fieldY).forEach(f => {
 	                const result = { key: f, operations: [] };
 	                if (isContinuous(this.getYAxisHelper().getScale(0).type)) {
 	                    result.operations = ['max', 'min'];
@@ -60972,14 +61635,8 @@
 	        if (isValid(this._spec.direction)) {
 	            this._direction = this._spec.direction;
 	        }
-	        if (this._direction === Direction$2.vertical) {
-	            this.setFieldY2('y1');
-	            this.setFieldX2(this._spec?.x2Field);
-	        }
-	        else {
-	            this.setFieldX2('x1');
-	            this.setFieldY2(this._spec?.y2Field);
-	        }
+	        this.setFieldX2(this._spec?.x2Field);
+	        this.setFieldY2(this._spec?.y2Field);
 	        if (this._stack) {
 	            this.setValueFieldToStack();
 	        }
@@ -62421,7 +63078,7 @@
 	                type: 'waterfallFillTotal',
 	                options: {
 	                    indexField: this.getGroupFields()[0],
-	                    valueField: this.getStackValueField()[0],
+	                    valueField: this.getStackValueField(),
 	                    seriesField: this.getSeriesField(),
 	                    seriesFieldName: this._theme.seriesFieldName,
 	                    total: this._spec.total
@@ -62437,7 +63094,7 @@
 	            type: 'waterfall',
 	            options: {
 	                indexField: this.getGroupFields()[0],
-	                valueField: this.getStackValueField()[0],
+	                valueField: this.getStackValueField(),
 	                seriesField: this.getSeriesField(),
 	                seriesFieldName: this._theme.seriesFieldName,
 	                startAs: STACK_FIELD_START,
@@ -62500,19 +63157,20 @@
 	        }
 	    }
 	    _totalPositionX(datum, field, pos = 0.5) {
-	        const { dataToPosition } = this._xAxisHelper;
+	        const { dataToPosition, getBandwidth } = this._xAxisHelper;
 	        if (this._direction === Direction$2.vertical) {
 	            return (dataToPosition([datum[field]], {
 	                bandPosition: this._bandPosition
 	            }) +
-	                this._rectMark.getAttribute('width', datum) * pos);
+	                getBandwidth(0) * 0.5 -
+	                this._rectMark.getAttribute('width', datum) * (0.5 - pos));
 	        }
 	        return valueInScaleRange(dataToPosition([datum[field]], {
 	            bandPosition: this._bandPosition
 	        }));
 	    }
 	    _totalPositionY(datum, field, pos = 0.5) {
-	        const { dataToPosition } = this._yAxisHelper;
+	        const { dataToPosition, getBandwidth } = this._yAxisHelper;
 	        if (this._direction === Direction$2.vertical) {
 	            return valueInScaleRange(dataToPosition([datum[field]], {
 	                bandPosition: this._bandPosition
@@ -62521,7 +63179,8 @@
 	        return (dataToPosition([datum[field]], {
 	            bandPosition: this._bandPosition
 	        }) +
-	            this._rectMark.getAttribute('height', datum) * pos);
+	            getBandwidth(0) * 0.5 -
+	            this._rectMark.getAttribute('height', datum) * (0.5 - pos));
 	    }
 	    initMarkStyle() {
 	        super.initMarkStyle();
@@ -75238,9 +75897,9 @@
 	    angle: {}
 	};
 	function transformAxisLineStyle(lineCfg) {
-	    transformComponentStyle(lineCfg);
-	    transformComponentStyle(lineCfg.startSymbol);
-	    transformComponentStyle(lineCfg.endSymbol);
+	    lineCfg = transformComponentStyle(lineCfg);
+	    lineCfg.startSymbol = transformComponentStyle(lineCfg.startSymbol);
+	    lineCfg.endSymbol = transformComponentStyle(lineCfg.endSymbol);
 	    return lineCfg;
 	}
 	function getAxisLabelOffset(axisSpec) {
@@ -76780,7 +77439,7 @@
 	                        resultObj[d[state]] = 0;
 	                    }
 	                    if (!isNil(valueFields[i])) {
-	                        resultObj[d[state]] += parseFloat(d[valueFields[i]]);
+	                        resultObj[d[state]] += isNaN(parseFloat(d[valueFields[i]])) ? 1 : parseFloat(d[valueFields[i]]);
 	                    }
 	                }
 	            });
@@ -76945,7 +77604,6 @@
 	        const dataCollection = [];
 	        const stateFields = [];
 	        const valueFields = [];
-	        let hasValidateValueField = false;
 	        if (this._relatedAxisComponent) {
 	            const originalStateFields = {};
 	            eachSeries(this._regions, s => {
@@ -76971,19 +77629,12 @@
 	                            : yAxisHelper;
 	                const valueAxisHelper = stateAxisHelper === xAxisHelper ? yAxisHelper : xAxisHelper;
 	                const isValidateValueAxis = isContinuous(valueAxisHelper.getScale(0).type);
-	                if (isValidateValueAxis) {
-	                    hasValidateValueField = true;
-	                }
 	                dataCollection.push(s.getRawData());
 	                const seriesSpec = s.getSpec();
 	                const xFields = array(seriesSpec.xField);
 	                const yFields = array(seriesSpec.yField);
-	                const xField = s.coordinate === 'cartesian'
-	                    ? xFields[xFields.length - 1]
-	                    : seriesSpec.angleField ?? seriesSpec.categoryField;
-	                const yField = s.coordinate === 'cartesian'
-	                    ? yFields[yFields.length - 1]
-	                    : seriesSpec.radiusField ?? seriesSpec.valueField;
+	                const xField = s.coordinate === 'cartesian' ? xFields[0] : seriesSpec.angleField ?? seriesSpec.categoryField;
+	                const yField = s.coordinate === 'cartesian' ? yFields[0] : seriesSpec.radiusField ?? seriesSpec.valueField;
 	                originalStateFields[s.id] =
 	                    s.type === 'link' ? 'from_xField' : stateAxisHelper === xAxisHelper ? xField : yField;
 	                stateFields.push(originalStateFields[s.id]);
@@ -76998,7 +77649,7 @@
 	            this._originalStateFields = originalStateFields;
 	        }
 	        else {
-	            hasValidateValueField = isNil(this._spec.valueField);
+	            isNil(this._spec.valueField);
 	            eachSeries(this._regions, s => {
 	                dataCollection.push(s.getRawData());
 	                stateFields.push(this._field);
@@ -77024,7 +77675,7 @@
 	                },
 	                output: {
 	                    stateField: this._stateField,
-	                    valueField: hasValidateValueField ? this._valueField : null
+	                    valueField: this._valueField
 	                }
 	            }
 	        }, false);
@@ -77394,6 +78045,8 @@
 	    _valueScale;
 	    _backgroundSize;
 	    _middleHandlerSize;
+	    _startHandlerSize;
+	    _endHandlerSize;
 	    static createComponent(spec, options) {
 	        const compSpec = spec.dataZoom || options.defaultSpec;
 	        if (isNil(compSpec)) {
@@ -77434,6 +78087,10 @@
 	                ? this._height - this._middleHandlerSize
 	                : this._width - this._middleHandlerSize;
 	        }
+	        const startHandlerVisble = this._spec.startHandler.style.visible ?? true;
+	        const endHandlerVisble = this._spec.endHandler.style.visible ?? true;
+	        this._startHandlerSize = startHandlerVisble ? this._spec.startHandler.style.size : 0;
+	        this._endHandlerSize = endHandlerVisble ? this._spec.endHandler.style.size : 0;
 	    }
 	    onLayoutEnd(ctx) {
 	        this._updateScaleRange();
@@ -77448,19 +78105,20 @@
 	        }
 	    }
 	    _updateScaleRange() {
+	        const handlerSize = (this._startHandlerSize + this._endHandlerSize) / 2;
 	        if (!this._stateScale || !this._valueScale) {
 	            return;
 	        }
 	        if (this._isHorizontal) {
-	            this._stateScale.range([0, this._computeWidth()]);
+	            this._stateScale.range([0, this._computeWidth() - handlerSize]);
 	            this._valueScale.range([this._computeHeight() - this._middleHandlerSize, 0]);
 	        }
 	        else if (this.layoutOrient === 'left') {
-	            this._stateScale.range([0, this._computeHeight()]);
+	            this._stateScale.range([0, this._computeHeight() - handlerSize]);
 	            this._valueScale.range([this._computeWidth() - this._middleHandlerSize, 0]);
 	        }
 	        else {
-	            this._stateScale.range([0, this._computeHeight()]);
+	            this._stateScale.range([0, this._computeHeight() - handlerSize]);
 	            this._valueScale.range([0, this._computeWidth() - this._middleHandlerSize]);
 	        }
 	        if (this._component) {
@@ -77501,29 +78159,33 @@
 	        if (this._isHorizontal) {
 	            return this._backgroundSize + this._middleHandlerSize;
 	        }
-	        return this.getLayoutRect().height;
+	        return this.getLayoutRect().height - (this._startHandlerSize + this._endHandlerSize) / 2;
 	    }
 	    _dataToPositionX = (datum) => {
 	        const offsetLeft = this._orient === 'left' ? this._middleHandlerSize : 0;
+	        const offsetHandler = this._isHorizontal ? this._startHandlerSize / 2 : 0;
 	        const xScale = this._isHorizontal ? this._stateScale : this._valueScale;
-	        return xScale.scale(datum[this._stateField]) + this.getLayoutStartPoint().x + offsetLeft;
+	        return xScale.scale(datum[this._stateField]) + this.getLayoutStartPoint().x + offsetLeft + offsetHandler;
 	    };
 	    _dataToPositionX2 = (datum) => {
 	        const offsetLeft = this._orient === 'left' ? this._middleHandlerSize : 0;
+	        const offsetHandler = this._isHorizontal ? this._startHandlerSize / 2 : 0;
 	        const xScale = this._isHorizontal ? this._stateScale : this._valueScale;
 	        const min = xScale.domain()[0];
-	        return xScale.scale(min) + this.getLayoutStartPoint().x + offsetLeft;
+	        return xScale.scale(min) + this.getLayoutStartPoint().x + offsetLeft + offsetHandler;
 	    };
 	    _dataToPositionY = (datum) => {
 	        const offsetTop = this._isHorizontal ? this._middleHandlerSize : 0;
+	        const offsetHandler = this._isHorizontal ? 0 : this._startHandlerSize / 2;
 	        const yScale = this._isHorizontal ? this._valueScale : this._stateScale;
-	        return yScale.scale(datum[this._valueField]) + this.getLayoutStartPoint().y + offsetTop;
+	        return yScale.scale(datum[this._valueField]) + this.getLayoutStartPoint().y + offsetTop + offsetHandler;
 	    };
 	    _dataToPositionY2 = (datum) => {
 	        const offsetTop = this._isHorizontal ? this._middleHandlerSize : 0;
+	        const offsetHandler = this._isHorizontal ? 0 : this._startHandlerSize / 2;
 	        const yScale = this._isHorizontal ? this._valueScale : this._stateScale;
 	        const min = yScale.domain()[0];
-	        return yScale.scale(min) + this.getLayoutStartPoint().y + offsetTop;
+	        return yScale.scale(min) + this.getLayoutStartPoint().y + offsetTop + offsetHandler;
 	    };
 	    _createOrUpdateComponent() {
 	        if (!this._component) {
@@ -79569,8 +80231,8 @@
 	                space: spec.label.space,
 	                inside: spec.label.inside,
 	                style: isFunction(spec.label.style)
-	                    ? (datum, index) => {
-	                        const style = this._preprocessSpec(spec.label.style(datum.rawValue, index, datum));
+	                    ? (datum, index, data, layer) => {
+	                        const style = this._preprocessSpec(spec.label.style(datum.rawValue, index, datum, data, layer));
 	                        return transformToGraphic(this._preprocessSpec(merge$2({}, this._theme.label?.style, style)));
 	                    }
 	                    : transformToGraphic(spec.label.style),
@@ -79579,7 +80241,7 @@
 	                        return spec.label.formatMethod(datum.rawValue, datum);
 	                    }
 	                    : null,
-	                state: transformStateStyle(spec.label.state),
+	                state: transformAxisLabelStateStyle(spec.label.state),
 	                autoRotate: !!spec.label.autoRotate,
 	                autoHide: !!spec.label.autoHide,
 	                autoLimit: !!spec.label.autoLimit,
@@ -79595,8 +80257,8 @@
 	                inside: spec.tick.inside,
 	                alignWithLabel: spec.tick.alignWithLabel,
 	                style: isFunction(spec.tick.style)
-	                    ? (datum, index) => {
-	                        const style = this._preprocessSpec(spec.tick.style(datum.rawValue, index, datum));
+	                    ? (value, index, datum, data) => {
+	                        const style = this._preprocessSpec(spec.tick.style(value, index, datum, data));
 	                        return transformToGraphic(this._preprocessSpec(merge$2({}, this._theme.tick?.style, style)));
 	                    }
 	                    : transformToGraphic(spec.tick.style),
@@ -79607,7 +80269,12 @@
 	                length: spec.subTick.tickSize,
 	                inside: spec.subTick.inside,
 	                count: spec.subTick.tickCount,
-	                style: transformToGraphic(spec.subTick.style),
+	                style: isFunction(spec.subTick.style)
+	                    ? (value, index, datum, data) => {
+	                        const style = spec.subTick.style(value, index, datum, data);
+	                        return transformToGraphic(merge$2({}, this._theme.subTick?.style, style));
+	                    }
+	                    : transformToGraphic(spec.subTick.style),
 	                state: transformStateStyle(spec.subTick.state)
 	            },
 	            grid: {
@@ -79960,7 +80627,9 @@
 	            }
 	            else {
 	                if (isXAxis(this.orient)) {
-	                    field = s.fieldX;
+	                    field = s.fieldX2
+	                        ? [...s.fieldX, s.fieldX2]
+	                        : s.fieldX;
 	                }
 	                else if (isZAxis(this.orient)) {
 	                    field = s.fieldZ;
@@ -81191,10 +81860,10 @@
 	    if (!isEmpty(item.focusIconStyle)) {
 	        transformToGraphic(item.focusIconStyle);
 	    }
-	    transformComponentStyle(item.shape);
-	    transformComponentStyle(item.label);
-	    transformComponentStyle(item.value);
-	    transformComponentStyle(item.background);
+	    item.shape = transformComponentStyle(item.shape);
+	    item.label = transformComponentStyle(item.label);
+	    item.value = transformComponentStyle(item.value);
+	    item.background = transformComponentStyle(item.background);
 	    if (isPercent(item.maxWidth)) {
 	        item.maxWidth = (Number(item.maxWidth.substring(0, item.maxWidth.length - 1)) * rect.width) / 100;
 	    }
@@ -87950,6 +88619,7 @@
 	    }
 	}
 
+	loadPoptip({});
 	VChart.useChart([
 	    AreaChart,
 	    LineChart,