@visactor/vchart 1.5.1-alpha.2 → 1.5.1-alpha.4

package/build/index.js

@@ -22154,16 +22154,17 @@
       }
       createCommonPattern(size, padding, color, targetContext, cb) {
         const r = (size - 2 * padding) / 2,
+          dpr = targetContext.dpr,
           canvas = canvasAllocate.allocate({
             width: size,
             height: size,
-            dpr: 1
+            dpr: dpr
           }),
           ctx = canvas.getContext("2d");
         if (!ctx) return null;
-        ctx.clearRect(0, 0, size, size), cb(r, ctx);
+        ctx.inuse = !0, ctx.clearMatrix(), ctx.setTransformForCurrent(!0), ctx.clearRect(0, 0, size, size), cb(r, ctx);
         const pattern = targetContext.createPattern(canvas.nativeCanvas, "repeat");
-        return canvasAllocate.free(canvas), pattern;
+        return pattern.setTransform && pattern.setTransform(new DOMMatrix([1 / dpr, 0, 0, 1 / dpr, 0, 0])), canvasAllocate.free(canvas), pattern;
       }
       createCirclePattern(size, padding, color, targetContext) {
         return this.createCommonPattern(size, padding, color, targetContext, (r, ctx) => {
@@ -27312,7 +27313,7 @@
     const gauge = {
         outerRadius: 0.8,
         innerRadius: 0.6,
-        padAngle: 0.02,
+        padAngle: 1.146,
         segment: {
             style: {
                 fillOpacity: 1
@@ -38696,7 +38697,7 @@
       })), Factory$1.registerAnimationType("linkPathGrowIn", linkPathGrowIn), Factory$1.registerAnimationType("linkPathGrowOut", linkPathGrowOut), Factory$1.registerAnimationType("linkPathUpdate", linkPathUpdate);
     };
 
-    const GROUP_ATTRIBUTES = ["x", "y", "dx", "dy", "scaleX", "scaleY", "angle", "anchor", "postMatrix", "visible", "clip", "pickable", "childrenPickable", "zIndex"];
+    const GROUP_ATTRIBUTES = ["x", "y", "dx", "dy", "scaleX", "scaleY", "angle", "anchor", "postMatrix", "visible", "clip", "pickable", "childrenPickable", "zIndex", "cursor"];
     class AbstractComponent extends Group$1 {
       constructor(attributes) {
         let mode = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "2d";
@@ -38780,7 +38781,11 @@
             } = this._getSliderRenderBounds();
           "vertical" === direction ? (currentPos = e.clientY, delta = currentPos - this._prePos, currentScrollValue = delta / height) : (currentPos = e.clientX, delta = currentPos - this._prePos, currentScrollValue = delta / width), this.setScrollRange([preScrollRange[0] + currentScrollValue, preScrollRange[1] + currentScrollValue], !0), this._prePos = currentPos;
         }, this._onSliderPointerUp = e => {
-          e.preventDefault(), "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onSliderPointerMove), vglobal.removeEventListener("pointerup", this._onSliderPointerUp)) : (this._slider.removeEventListener("pointermove", this._onSliderPointerMove), this._slider.removeEventListener("pointerup", this._onSliderPointerUp), this._slider.removeEventListener("pointerupoutside", this._onSliderPointerUp));
+          e.preventDefault(), "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onSliderPointerMove, {
+            capture: !0
+          }), vglobal.removeEventListener("pointerup", this._onSliderPointerUp)) : (this._slider.removeEventListener("pointermove", this._onSliderPointerMove, {
+            capture: !0
+          }), this._slider.removeEventListener("pointerup", this._onSliderPointerUp), this._slider.removeEventListener("pointerupoutside", this._onSliderPointerUp));
         };
       }
       setScrollRange(range) {
@@ -38805,7 +38810,7 @@
         return this.attribute.range;
       }
       bindEvents() {
-        this._rail && this._rail.addEventListener("pointerdown", this._onRailPointerDown), this._slider && this._slider.addEventListener("pointerdown", this._onSliderPointerDown);
+        this.attribute.disableTriggerEvent || (this._rail && this._rail.addEventListener("pointerdown", this._onRailPointerDown), this._slider && this._slider.addEventListener("pointerdown", this._onSliderPointerDown));
       }
       render() {
         this._reset();
@@ -40089,6 +40094,7 @@
         isFunction$1(dataFilter) && (data = dataFilter(data)), labels = isFunction$1(customLayoutFunc) ? customLayoutFunc(data, d => this._idToGraphic.get(d.id)) : this._layout(data), isFunction$1(customOverlapFunc) ? labels = customOverlapFunc(labels, d => this._idToGraphic.get(d.id)) : !1 !== overlap && (labels = this._overlapping(labels)), !1 !== smartInvert && this._smartInvert(labels), this._renderLabels(labels);
       }
       _bindEvent(target) {
+        if (this.attribute.disableTriggerEvent) return;
         if (!target) return;
         const {
           hover: hover,
@@ -41330,10 +41336,11 @@
             line.name = `${this.name}-line`, line.id = this._getNodeId("line" + index), isEmpty(null == state ? void 0 : state.line) || (line.states = isArray$1(state.line) ? null !== (_b = state.line[index]) && void 0 !== _b ? _b : state.line[state.line.length - 1] : state.line), this.add(line);
           });
         } else {
-          const line = createLine(Object.assign(Object.assign({
+          const line = createPolygon(Object.assign(Object.assign({
             points: this._clipPoints(this.attribute.points)
           }, array(lineStyle)[0]), {
-            fill: !1
+            fill: !1,
+            closePath: !1
           }));
           line.name = `${this.name}-line`, line.id = this._getNodeId("line"), isEmpty(null == state ? void 0 : state.line) || (line.states = [].concat(state.line)[0]), this.add(line);
         }
@@ -41584,6 +41591,7 @@
         }), this.add(this._innerView), this._renderInner(this._innerView), this._bindEvent();
       }
       _bindEvent() {
+        if (this.attribute.disableTriggerEvent) return;
         const {
           hover: hover,
           select: select
@@ -43227,6 +43235,7 @@
         start && (this.state.start = start), end && (this.state.end = end), this._isHorizontal = "top" === orient || "bottom" === orient, this._layoutCache.max = this._isHorizontal ? width : height, this._layoutCache.attPos = this._isHorizontal ? "x" : "y", this._layoutCache.attSize = this._isHorizontal ? "width" : "height", this._activeCache.startPos = position, this._activeCache.lastPos = position, this._showText = "auto" !== showDetail && showDetail, previewData && (this._previewData = previewData), isFunction$1(previewCallbackX) && (this._previewCallbackX = previewCallbackX), isFunction$1(previewCallbackY) && (this._previewCallbackY = previewCallbackY), isFunction$1(previewCallbackX1) && (this._previewCallbackX1 = previewCallbackX1), isFunction$1(previewCallbackY1) && (this._previewCallbackY1 = previewCallbackY1), isFunction$1(updateStateCallback) && (this._updateStateCallback = updateStateCallback);
       }
       bindEvents() {
+        if (this.attribute.disableTriggerEvent) return;
         const {
           showDetail: showDetail,
           brushSelect: brushSelect
@@ -44018,6 +44027,12 @@
     }
 
     let MarkLine$1 = class MarkLine extends Marker {
+      getLine() {
+        return this._line;
+      }
+      getLabel() {
+        return this._label;
+      }
       constructor(attributes) {
         super(merge$1({}, MarkLine.defaultAttributes, attributes));
       }
@@ -44114,6 +44129,12 @@
     MarkLine$1.defaultAttributes = DEFAULT_MARK_LINE_THEME;
 
     let MarkArea$1 = class MarkArea extends Marker {
+      getArea() {
+        return this._area;
+      }
+      getLabel() {
+        return this._label;
+      }
       constructor(attributes) {
         super(merge$1({}, MarkArea.defaultAttributes, attributes));
       }
@@ -44484,7 +44505,7 @@
         container.translateTo(0 - containerBounds.x1 + parsedPadding[3], 0 - containerBounds.y1 + parsedPadding[0]), this.add(container), this.attribute.width = width + parsedPadding[1] + parsedPadding[3], this.attribute.height = height + parsedPadding[0] + parsedPadding[2], this._bindEvents();
       }
       _bindEvents() {
-        this.preHandler && (this.preHandler.addEventListener("pointerenter", this._onHover), this.preHandler.addEventListener("pointerleave", this._onUnHover), this.preHandler.addEventListener("pointerdown", this._onClick)), this.nextHandler && (this.nextHandler.addEventListener("pointerenter", this._onHover), this.nextHandler.addEventListener("pointerleave", this._onUnHover), this.nextHandler.addEventListener("pointerdown", this._onClick));
+        this.attribute.disableTriggerEvent || (this.preHandler && (this.preHandler.addEventListener("pointerenter", this._onHover), this.preHandler.addEventListener("pointerleave", this._onUnHover), this.preHandler.addEventListener("pointerdown", this._onClick)), this.nextHandler && (this.nextHandler.addEventListener("pointerenter", this._onHover), this.nextHandler.addEventListener("pointerleave", this._onUnHover), this.nextHandler.addEventListener("pointerdown", this._onClick)));
       }
       _reset() {
         this.removeAllChild(), this._current = 1, this._total = this.attribute.total, this.preHandler = this.nextHandler = this.text = null;
@@ -44713,6 +44734,7 @@
         doWrap && autoPage && pages > maxPages && (pagerRendered = this._renderPager(isHorizontal)), pagerRendered || (itemsContainer.setAttribute("y", this._title ? this._title.AABBBounds.height() + get$1(this.attribute, "title.space", 8) : 0), this._innerView.add(itemsContainer));
       }
       _bindEvents() {
+        if (this.attribute.disableTriggerEvent) return;
         if (!this._itemsContainer) return;
         const {
           hover = !0,
@@ -44833,7 +44855,8 @@
             maxCol = 1,
             maxRow = 2,
             item = {},
-            pager = {}
+            pager = {},
+            disableTriggerEvent: disableTriggerEvent
           } = this.attribute,
           {
             spaceCol = DEFAULT_ITEM_SPACE_COL,
@@ -44854,7 +44877,7 @@
           startY = 0,
           pages = 1;
         if (isHorizontal) {
-          if (pagerComp = new Pager(Object.assign({
+          if (pagerComp = new Pager(Object.assign(Object.assign({
             layout: 1 === maxRow ? "horizontal" : "vertical",
             total: 99
           }, merge$1({
@@ -44862,7 +44885,9 @@
               preShape: "triangleUp",
               nextShape: "triangleDown"
             }
-          }, pageStyle))), this._pager = pagerComp, this._innerView.add(pagerComp), pageHeight = (maxRow - 1) * spaceRow + this._itemHeight * maxRow, pageWidth = maxWidth - pagerComp.AABBBounds.width() - pagerSpace, pageWidth <= 0) return this._innerView.removeChild(pagerComp), !1;
+          }, pageStyle)), {
+            disableTriggerEvent: disableTriggerEvent
+          })), this._pager = pagerComp, this._innerView.add(pagerComp), pageHeight = (maxRow - 1) * spaceRow + this._itemHeight * maxRow, pageWidth = maxWidth - pagerComp.AABBBounds.width() - pagerSpace, pageWidth <= 0) return this._innerView.removeChild(pagerComp), !1;
           itemsContainer.getChildren().forEach((item, index) => {
             const {
               width: width,
@@ -44880,7 +44905,8 @@
         } else {
           if (pagerComp = new Pager(Object.assign({
             layout: "horizontal",
-            total: 99
+            total: 99,
+            disableTriggerEvent: disableTriggerEvent
           }, pageStyle)), this._pager = pagerComp, this._innerView.add(pagerComp), pageWidth = this._itemMaxWidth * maxCol + (maxCol - 1) * spaceCol, pageHeight = maxHeight - pagerComp.AABBBounds.height() - pagerSpace - renderStartY, pageHeight <= 0) return this._innerView.removeChild(pagerComp), !1;
           itemsContainer.getChildren().forEach((item, index) => {
             const {
@@ -45157,7 +45183,11 @@
           }
           this._prePos = currentPos, this._dispatchChangeEvent();
         }, this._onTrackPointerUp = e => {
-          e.preventDefault(), "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onTrackPointerMove), vglobal.removeEventListener("pointerup", this._onTrackPointerUp)) : (this._track.removeEventListener("pointermove", this._onTrackPointerMove), this._track.removeEventListener("pointerup", this._onTrackPointerUp), this._track.removeEventListener("pointerupoutside", this._onTrackPointerUp));
+          e.preventDefault(), "browser" === vglobal.env ? (vglobal.removeEventListener("pointermove", this._onTrackPointerMove, {
+            capture: !0
+          }), vglobal.removeEventListener("pointerup", this._onTrackPointerUp)) : (this._track.removeEventListener("pointermove", this._onTrackPointerMove, {
+            capture: !0
+          }), this._track.removeEventListener("pointerup", this._onTrackPointerUp), this._track.removeEventListener("pointerupoutside", this._onTrackPointerUp));
         }, this._onRailPointerDown = e => {
           e.stopPropagation();
           const {
@@ -45402,6 +45432,7 @@
         return createText(textStyle);
       }
       _bindEvents() {
+        if (this.attribute.disableTriggerEvent) return;
         const {
           slidable: slidable,
           range: range
@@ -45562,7 +45593,8 @@
             endText: endText,
             handlerText: handlerText,
             showTooltip: showTooltip,
-            tooltip: tooltip
+            tooltip: tooltip,
+            disableTriggerEvent: disableTriggerEvent
           } = this.attribute,
           domain = [],
           step = (max - min) / (colors.length - 1);
@@ -45593,12 +45625,13 @@
           endText: endText,
           handlerText: handlerText,
           showTooltip: showTooltip,
-          tooltip: tooltip
+          tooltip: tooltip,
+          disableTriggerEvent: disableTriggerEvent
         });
         this._innerView.add(slider), this._slider = slider, slider.translateTo(0 - slider.AABBBounds.x1, (this._title ? this._title.AABBBounds.height() + get$1(this.attribute, "title.space", DEFAULT_TITLE_SPACE) : 0) - slider.AABBBounds.y1), this._updateColor();
       }
       _bindEvents() {
-        this._slider && this._slider.addEventListener("change", this._onSliderChange);
+        this.attribute.disableTriggerEvent || this._slider && this._slider.addEventListener("change", this._onSliderChange);
       }
       _getTrackColor() {
         const {
@@ -45735,7 +45768,8 @@
             handlerText: handlerText,
             showTooltip: showTooltip,
             tooltip: tooltip,
-            sizeBackground: sizeBackground
+            sizeBackground: sizeBackground,
+            disableTriggerEvent: disableTriggerEvent
           } = this.attribute,
           mainContainer = createGroup({
             x: 0,
@@ -45768,7 +45802,8 @@
           endText: endText,
           handlerText: handlerText,
           showTooltip: showTooltip,
-          tooltip: tooltip
+          tooltip: tooltip,
+          disableTriggerEvent: disableTriggerEvent
         });
         mainContainer.add(slider);
         let path,
@@ -45786,7 +45821,7 @@
         mainContainer.translate(0 - mainContainer.AABBBounds.x1, titleSpace - mainContainer.AABBBounds.y1), this._slider = slider;
       }
       _bindEvents() {
-        this._slider && this._slider.addEventListener("change", this._onSliderChange);
+        this.attribute.disableTriggerEvent || this._slider && this._slider.addEventListener("change", this._onSliderChange);
       }
     }
     SizeContinuousLegend.defaultAttributes = {
@@ -46083,13 +46118,13 @@
         }, this._initForward = () => {
           isNil$1(this._forwardController) && (this._forwardController = new PlayerIcon(Object.assign({}, this._forwardAttr.style)), this.add(this._forwardController));
         }, this._initEvents = () => {
-          this._playController.addEventListener("pointerdown", e => {
+          this.attribute.disableTriggerEvent || (this._playController.addEventListener("pointerdown", e => {
             e.stopPropagation(), !0 === this._isPaused ? this.play() : this.pause();
           }), this._backwardController.addEventListener("pointerdown", e => {
             e.stopPropagation(), this.backward();
           }), this._forwardController.addEventListener("pointerdown", e => {
             e.stopPropagation(), this.forward();
-          });
+          }));
         }, this._createCustomEvent = eventType => {
           var _a;
           const customEvent = new CustomEvent(eventType, {
@@ -46265,7 +46300,8 @@
             },
             endText: {
               visible: !1
-            }
+            },
+            disableTriggerEvent: this.attribute.disableTriggerEvent
           };
           if (isHorizontal$1(this._orient)) {
             const railWidth = Math.max(0, this._layoutInfo.slider.size),
@@ -46285,7 +46321,8 @@
             start: this._start,
             pause: this._pause,
             forward: this._forward,
-            backward: this._backward
+            backward: this._backward,
+            disableTriggerEvent: this.attribute.disableTriggerEvent
           };
           return isHorizontal$1(this._orient) ? (attrs.layout = "horizontal", attrs.start = Object.assign(Object.assign({}, attrs.start), {
             style: Object.assign(Object.assign({}, attrs.start.style), {
@@ -46455,7 +46492,7 @@
           var _a, _b, _c, _d;
           super._initAttributes(), this._alternate = null !== (_a = this.attribute.alternate) && void 0 !== _a && _a, this._interval = null !== (_b = this.attribute.interval) && void 0 !== _b ? _b : 1e3, this._direction = null !== (_c = this.attribute.direction) && void 0 !== _c ? _c : DirectionEnum.Default, this._dataIndex = isNil$1(this.attribute.dataIndex) ? "default" === this._direction ? this._minIndex : this._maxIndex : null !== (_d = this.attribute.dataIndex) && void 0 !== _d ? _d : 0, this._slider.setAttribute("value", this._dataIndex);
         }, this._initEvents = () => {
-          this._controller.addEventListener(ControllerEventEnum.OnPlay, e => {
+          this.attribute.disableTriggerEvent || (this._controller.addEventListener(ControllerEventEnum.OnPlay, e => {
             e.stopPropagation(), this.play();
           }), this._controller.addEventListener(ControllerEventEnum.OnPause, e => {
             e.stopPropagation(), this.pause();
@@ -46466,7 +46503,7 @@
           }), this._slider.addEventListener("change", e => {
             const middle = Math.floor(e.detail.value) + .5;
             this._dataIndex = e.detail.value >= middle ? Math.ceil(e.detail.value) : Math.floor(e.detail.value), this._slider.setValue(this._dataIndex), this.dispatchCustomEvent(PlayerEventEnum.change);
-          });
+          }));
         }, this.play = () => {
           this._isPlaying || 1 !== this._data.length && (this._controller.togglePause(), this._isPlaying = !0, (isReachEnd({
             dataIndex: this._dataIndex,
@@ -46538,7 +46575,7 @@
           const frames = this._data.length;
           this.attribute.totalDuration && this._data.length ? (this._totalDuration = this.attribute.totalDuration, this._interval = this._totalDuration / (null != frames ? frames : 1)) : (this._totalDuration = this._interval * frames, this._interval = this.attribute.interval);
         }, this._initEvents = () => {
-          this._controller.addEventListener(ControllerEventEnum.OnPlay, e => {
+          this.attribute.disableTriggerEvent || (this._controller.addEventListener(ControllerEventEnum.OnPlay, e => {
             e.stopPropagation(), this.play();
           }), this._controller.addEventListener(ControllerEventEnum.OnPause, e => {
             e.stopPropagation(), this.pause();
@@ -46552,7 +46589,7 @@
             const value = null === (_a = e.detail) || void 0 === _a ? void 0 : _a.value,
               progress = value / this._maxIndex;
             this._elapsed = progress * this._totalDuration, this._startTime = Date.now() - this._elapsed, this._dispatchChange(value);
-          });
+          }));
         }, this._getSliderValue = () => {
           const progress = this._elapsed / this._totalDuration;
           return Math.min(progress * this._maxIndex, this._maxIndex);
@@ -46654,6 +46691,7 @@
         };
       }
       bindBrushEvents() {
+        if (this.attribute.disableTriggerEvent) return;
         const {
           delayType = "throttle",
           delayTime = 0,
@@ -52471,7 +52509,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             (_a = this._view) === null || _a === void 0 ? void 0 : _a.release();
             this._view = null;
             this.isInited = false;
-            this._rafId = null;
             this.isReleased = true;
         }
         releaseGrammar() {
@@ -57784,12 +57821,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         Factory.registerMark(GroupMark.type, GroupMark);
         View.useRegisters([registerFilterTransform, registerMapTransform]);
         registerVGrammarAnimation();
-        initAllEnv();
         Logger.getInstance(LoggerLevel.Error);
     };
     registerVChartCore();
 
-    const version = "1.5.1-alpha.2";
+    const version = "1.5.1-alpha.4";
 
     class ChartData {
         get dataList() {
@@ -68054,16 +68090,22 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
         }
         _getAngleValueStartWithoutMask(datum) {
-            var _a;
-            const angle = isValid$1(datum[SEGMENT_FIELD_START])
+            const startAngle = this._getAngleValueStartWithoutPadAngle(datum);
+            const endAngle = this._getAngleValueEndWithoutPadAngle(datum);
+            return Math.min(startAngle + this._padAngle / 2, (startAngle + endAngle) / 2);
+        }
+        _getAngleValueEndWithoutMask(datum) {
+            const startAngle = this._getAngleValueStartWithoutPadAngle(datum);
+            const endAngle = this._getAngleValueEndWithoutPadAngle(datum);
+            return Math.max(endAngle - this._padAngle / 2, (startAngle + endAngle) / 2);
+        }
+        _getAngleValueStartWithoutPadAngle(datum) {
+            return isValid$1(datum[SEGMENT_FIELD_START])
                 ? this.angleAxisHelper.dataToPosition([datum[SEGMENT_FIELD_START]])
                 : this._startAngle;
-            return angle + ((_a = this._spec.padAngle) !== null && _a !== void 0 ? _a : 0) / 2;
         }
-        _getAngleValueEndWithoutMask(datum) {
-            var _a;
-            const angle = this.angleAxisHelper.dataToPosition([datum[SEGMENT_FIELD_END]]);
-            return angle - ((_a = this._spec.padAngle) !== null && _a !== void 0 ? _a : 0) / 2;
+        _getAngleValueEndWithoutPadAngle(datum) {
+            return this.angleAxisHelper.dataToPosition([datum[SEGMENT_FIELD_END]]);
         }
         _preprocessLabelSpec() {
             const labelSpec = mergeSpec({ animation: this._spec.animation }, this._spec.label);
@@ -76672,32 +76714,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     const allLinkElements = vGrammarMark.elements;
                     allLinkElements.forEach(linkEl => {
                         linkEl.clearStates();
-                        const linkDatum = linkEl.getDatum();
-                        const father = (linkDatum === null || linkDatum === void 0 ? void 0 : linkDatum.parents) ? 'parents' : 'source';
-                        if (linkDatum.source === curLinkDatum.target ||
-                            (array(linkDatum[father]).includes(curLinkDatum.source) &&
-                                array(linkDatum[father]).includes(curLinkDatum.target))) {
-                            if (!highlightNodes.includes(linkDatum.source)) {
-                                highlightNodes.push(linkDatum.source);
-                            }
-                            if (!highlightNodes.includes(linkDatum.target)) {
-                                highlightNodes.push(linkDatum.target);
-                            }
-                            let ratio;
-                            if (father === 'parents') {
-                                const originalDatum = linkDatum.datum;
-                                const val = originalDatum
-                                    ? originalDatum
-                                        .filter((entry) => entry.parents.some((par, index) => { var _a; return par.key === curLinkDatum.source && ((_a = entry.parents[index + 1]) === null || _a === void 0 ? void 0 : _a.key) === curLinkDatum.target; }))
-                                        .reduce((sum, d) => {
-                                        return (sum += d.value);
-                                    }, 0)
-                                    : 0;
-                                ratio = val / linkDatum.value;
-                            }
-                            linkEl.addState('selected', { ratio });
+                        if (linkEl === element) {
+                            linkEl.addState('selected', { ratio: 1 });
                         }
-                        else if (linkEl === element) ;
                         else {
                             linkEl.useStates(['blur']);
                         }
@@ -81208,6 +81227,41 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         return boundingClientRect.height / element.offsetHeight;
     };
+    const measureTooltipText = (text, style) => {
+        var _a;
+        text = (text !== null && text !== void 0 ? text : '').toString();
+        const measure = initTextMeasure(style);
+        if (!style.multiLine) {
+            const { width, height } = measure.fullMeasure(text);
+            return {
+                width,
+                height,
+                text
+            };
+        }
+        let textLines = text.split('\n');
+        textLines = textLines.map((line, i) => (i < textLines.length - 1 ? line + '\n' : line));
+        const { width, height } = measure.fullMeasure(textLines);
+        if (style.maxWidth && style.maxWidth <= width) {
+            const bound = getRichTextBounds({
+                wordBreak: (_a = style.wordBreak) !== null && _a !== void 0 ? _a : 'break-word',
+                maxWidth: style.maxWidth,
+                width: 0,
+                height: 0,
+                textConfig: textLines.map((line, i) => (Object.assign(Object.assign({}, style), { text: line })))
+            });
+            return {
+                width: bound.width(),
+                height: bound.height(),
+                text: textLines
+            };
+        }
+        return {
+            width,
+            height,
+            text: textLines
+        };
+    };
 
     const TOOLTIP_EL_CLASS_NAME = 'vchart-tooltip-element';
     const TOOLTIP_CONTAINER_EL_CLASS_NAME = 'vchart-tooltip-container';
@@ -81583,182 +81637,208 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     const getHorizontalPositionType = (position, defaultCase) => { var _a, _b; return (_b = (_a = positionType[position]) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : defaultCase; };
     const getVerticalPositionType = (position, defaultCase) => { var _a, _b; return (_b = (_a = positionType[position]) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : defaultCase; };
 
-    const defaultTextAttributes = {
+    const DEFAULT_TEXT_ATTRIBUTES = {
         fontFamily: THEME_CONSTANTS.defaultFontFamily,
         spacing: 10,
-        multiLine: false,
         wordBreak: 'break-word'
     };
     function getTextAttributes(style = {}, globalTheme, defaultAttributes) {
         var _a, _b;
-        const attrs = Object.assign(Object.assign({}, (defaultAttributes !== null && defaultAttributes !== void 0 ? defaultAttributes : defaultTextAttributes)), { fill: ((_a = style.fill) !== null && _a !== void 0 ? _a : style.fontColor), textAlign: style.textAlign, textBaseline: style.textBaseline, fontFamily: (_b = style.fontFamily) !== null && _b !== void 0 ? _b : globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.fontFamily, fontSize: style.fontSize, fontWeight: style.fontWeight, lineHeight: style.lineHeight, spacing: style.spacing, multiLine: style.multiLine, maxWidth: style.maxWidth, wordBreak: style.wordBreak });
+        const attrs = Object.assign(Object.assign({}, (defaultAttributes !== null && defaultAttributes !== void 0 ? defaultAttributes : DEFAULT_TEXT_ATTRIBUTES)), { fill: ((_a = style.fill) !== null && _a !== void 0 ? _a : style.fontColor), textAlign: style.textAlign, textBaseline: style.textBaseline, fontFamily: (_b = style.fontFamily) !== null && _b !== void 0 ? _b : globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.fontFamily, fontSize: style.fontSize, fontWeight: style.fontWeight, lineHeight: style.lineHeight, spacing: style.spacing, multiLine: style.multiLine, maxWidth: style.maxWidth, wordBreak: style.wordBreak, autoWidth: style.autoWidth });
         return attrs;
     }
-
-    const getTooltipAttributes = (actualTooltip, style) => {
-        const { spaceRow: commonSpaceRow, padding, title: titleStyle, shape: shapeStyle, key: keyStyle, value: valueStyle } = style;
-        const attribute = Object.assign(Object.assign({}, style), { title: {}, content: [], titleStyle: {
+    const getPanelAttributes = (style) => {
+        var _a;
+        const { backgroundColor, border, shadow } = style;
+        const panelAttrs = {
+            lineWidth: (_a = border === null || border === void 0 ? void 0 : border.width) !== null && _a !== void 0 ? _a : 0,
+            shadow: !!shadow
+        };
+        if (border === null || border === void 0 ? void 0 : border.color) {
+            panelAttrs.stroke = border.color;
+        }
+        if (backgroundColor) {
+            panelAttrs.fill = backgroundColor;
+        }
+        if (shadow) {
+            panelAttrs.shadowColor = shadow.color;
+            panelAttrs.shadowBlur = shadow.blur;
+            panelAttrs.shadowOffsetX = shadow.x;
+            panelAttrs.shadowOffsetY = shadow.y;
+            panelAttrs.shadowSpread = shadow.spread;
+        }
+        const { radius } = border !== null && border !== void 0 ? border : {};
+        if (isValid$1(radius)) {
+            panelAttrs.cornerRadius = [radius, radius, radius, radius];
+        }
+        return panelAttrs;
+    };
+    const getTooltipAttributes = (actualTooltip, spec, globalTheme) => {
+        var _a, _b, _c, _d, _e;
+        const { style = {}, enterable, transitionDuration } = spec;
+        const { panel = {}, titleLabel, shape, keyLabel, valueLabel, spaceRow: commonSpaceRow } = style;
+        const padding = normalizePadding$1(panel.padding);
+        const paddingSpec = normalizeLayoutPaddingSpec(panel.padding);
+        const titleStyle = getTextAttributes(titleLabel, globalTheme);
+        const keyStyle = getTextAttributes(keyLabel, globalTheme);
+        const valueStyle = getTextAttributes(valueLabel, globalTheme);
+        const shapeStyle = {
+            fill: true,
+            size: (_a = shape === null || shape === void 0 ? void 0 : shape.size) !== null && _a !== void 0 ? _a : 8,
+            spacing: (_b = shape === null || shape === void 0 ? void 0 : shape.spacing) !== null && _b !== void 0 ? _b : 6
+        };
+        const attributes = {
+            panel: getPanelAttributes(panel),
+            padding,
+            title: {},
+            content: [],
+            titleStyle: {
                 value: titleStyle,
                 spaceRow: commonSpaceRow
-            }, contentStyle: {
+            },
+            contentStyle: {
                 shape: shapeStyle,
                 key: keyStyle,
                 value: valueStyle,
                 spaceRow: commonSpaceRow
-            }, hasContentShape: false, keyWidth: 0, valueWidth: 0 });
-        ['key', 'value', 'shape'].forEach(key => {
-            delete attribute[key];
-        });
+            },
+            hasContentShape: false,
+            keyWidth: 0,
+            valueWidth: 0,
+            enterable,
+            transitionDuration
+        };
         const { title = {}, content = [] } = actualTooltip;
-        let maxWidth = 0;
-        let containerHeight = padding.top + padding.bottom;
-        let titleMaxHeight = 0;
-        const { visible: titleVisible = true, value: titleValue = '', valueStyle: titleValueStyle, hasShape: titleHasShape, shapeType: titleShapeType = '', shapeHollow: titleShapeHollow, shapeColor: titleShapeColor, spaceRow: titleSpaceRow } = title;
-        attribute.title.visible = titleVisible;
-        attribute.title.spaceRow = titleSpaceRow !== null && titleSpaceRow !== void 0 ? titleSpaceRow : commonSpaceRow;
-        if (titleVisible) {
-            const lineTitleStyle = mergeSpec({}, titleStyle, getTextAttributes(titleValueStyle, undefined, {}));
-            const { text, width, height } = measureTooltipText(titleValue, lineTitleStyle);
-            attribute.title.value = Object.assign(Object.assign({ width,
-                height }, lineTitleStyle), { text });
-            maxWidth = width;
-            titleMaxHeight = height;
-            if (titleHasShape && builtinSymbolsMap[titleShapeType]) {
-                const titleShapeAttrs = {
-                    symbolType: titleShapeType
-                };
-                if (titleShapeHollow) {
-                    titleShapeAttrs.stroke = titleShapeColor;
-                }
-                else {
-                    titleShapeAttrs.fill = titleShapeColor;
-                }
-                attribute.title.shape = titleShapeAttrs;
-                maxWidth += shapeStyle.size + shapeStyle.spacing;
-                titleMaxHeight = Math.max(shapeStyle.size, titleMaxHeight);
-            }
-            attribute.title.width = maxWidth;
-            attribute.title.height = titleMaxHeight;
-            containerHeight += titleMaxHeight;
-        }
-        if (content.length) {
-            const filteredContent = content.filter(item => {
-                return (item.key || item.value) && item.visible !== false;
-            });
-            if (filteredContent.length) {
-                if (titleVisible) {
-                    containerHeight += attribute.title.spaceRow;
-                }
-                const keyWidths = [];
-                const adaptiveKeyWidths = [];
-                const valueWidths = [];
-                const shapeWidths = [];
-                attribute.content = filteredContent.map((item, i) => {
-                    let itemHeight = 0;
-                    const { hasShape, key, shapeColor, shapeHollow, shapeType = '', shapeFill, shapeStroke, shapeLineWidth, shapeSize, value, isKeyAdaptive, spaceRow: lineSpaceRow } = item;
-                    const itemAttrs = { height: 0, spaceRow: lineSpaceRow !== null && lineSpaceRow !== void 0 ? lineSpaceRow : commonSpaceRow };
-                    if (isValid$1(key)) {
-                        const lineKeyStyle = mergeSpec({}, keyStyle, getTextAttributes(item.keyStyle, undefined, {}));
-                        const { width, height, text } = measureTooltipText(key, lineKeyStyle);
-                        itemAttrs.key = Object.assign(Object.assign({ width,
-                            height }, lineKeyStyle), { text });
-                        if (!isKeyAdaptive) {
-                            keyWidths.push(width);
-                        }
-                        else {
-                            adaptiveKeyWidths.push(width);
-                        }
-                        itemHeight = Math.max(itemHeight, height);
+        let containerWidth = paddingSpec.left + paddingSpec.right;
+        let containerHeight = paddingSpec.top + paddingSpec.bottom;
+        let contentMaxWidth = 0;
+        const filteredContent = content.filter(item => {
+            return (item.key || item.value) && item.visible !== false;
+        });
+        const hasContent = !!filteredContent.length;
+        let maxKeyWidth = 0;
+        let maxAdaptiveKeyWidth = 0;
+        let maxValueWidth = 0;
+        let maxShapeWidth = 0;
+        if (hasContent) {
+            const keyWidths = [];
+            const adaptiveKeyWidths = [];
+            const valueWidths = [];
+            const shapeWidths = [];
+            attributes.content = filteredContent.map((item, i) => {
+                let itemHeight = 0;
+                const { hasShape: actualHasShape, key: actualKey, shapeType: actualShapeType = '', shapeFill: actualShapeFill, shapeStroke: actualShapeStroke, shapeLineWidth: actualShapeLineWidth, shapeSize: actualShapeSize, value: actualValue, isKeyAdaptive: actualIsKeyAdaptive, spaceRow: actualSpaceRow, keyStyle: actualKeyStyle, valueStyle: actualValueStyle, shapeColor: actualShapeColor, shapeHollow: actualShapeHollow } = item;
+                const itemAttrs = { height: 0, spaceRow: actualSpaceRow !== null && actualSpaceRow !== void 0 ? actualSpaceRow : commonSpaceRow };
+                if (isValid$1(actualKey)) {
+                    const itemKeyStyle = mergeSpec({}, keyStyle, getTextAttributes(actualKeyStyle, undefined, {}));
+                    const { width, height, text } = measureTooltipText(actualKey, itemKeyStyle);
+                    itemAttrs.key = Object.assign(Object.assign({ width,
+                        height }, itemKeyStyle), { text });
+                    if (!actualIsKeyAdaptive) {
+                        keyWidths.push(width);
                     }
-                    if (isValid$1(value)) {
-                        const lineValueStyle = mergeSpec({}, valueStyle, getTextAttributes(item.valueStyle, undefined, {}));
-                        const { width, height, text } = measureTooltipText(value, lineValueStyle);
-                        itemAttrs.value = Object.assign(Object.assign({ width,
-                            height }, lineValueStyle), { text });
-                        valueWidths.push(width);
-                        itemHeight = Math.max(itemHeight, height);
+                    else {
+                        adaptiveKeyWidths.push(width);
                     }
-                    if (hasShape) {
-                        const shape = {
-                            visible: true,
-                            symbolType: shapeType
-                        };
-                        const adaptiveShapeFill = shapeFill !== null && shapeFill !== void 0 ? shapeFill : shapeColor;
-                        if (shapeHollow) {
-                            shape.stroke = adaptiveShapeFill;
-                        }
-                        else {
-                            shape.fill = adaptiveShapeFill;
-                        }
-                        shape.stroke = shapeStroke !== null && shapeStroke !== void 0 ? shapeStroke : adaptiveShapeFill;
-                        shape.lineWidth = shapeLineWidth;
-                        itemAttrs.shape = shape;
-                        const shapeWidth = shapeSize !== null && shapeSize !== void 0 ? shapeSize : shapeStyle.size;
-                        itemHeight = Math.max(shapeWidth, itemHeight);
-                        shapeWidths.push(shapeWidth);
+                    itemHeight = Math.max(itemHeight, height);
+                }
+                if (isValid$1(actualValue)) {
+                    const itemValueStyle = mergeSpec({}, valueStyle, getTextAttributes(actualValueStyle, undefined, {}));
+                    const { width, height, text } = measureTooltipText(actualValue, itemValueStyle);
+                    itemAttrs.value = Object.assign(Object.assign({ width,
+                        height }, itemValueStyle), { text });
+                    valueWidths.push(width);
+                    itemHeight = Math.max(itemHeight, height);
+                }
+                if (actualHasShape) {
+                    const shape = {
+                        visible: true,
+                        symbolType: actualShapeType
+                    };
+                    const adaptiveShapeFill = actualShapeFill !== null && actualShapeFill !== void 0 ? actualShapeFill : actualShapeColor;
+                    if (actualShapeHollow) {
+                        shape.stroke = adaptiveShapeFill;
                     }
                     else {
-                        itemAttrs.shape = { visible: false };
-                    }
-                    itemAttrs.height = itemHeight;
-                    containerHeight += itemHeight;
-                    if (i < filteredContent.length - 1) {
-                        containerHeight += itemAttrs.spaceRow;
+                        shape.fill = adaptiveShapeFill;
                     }
-                    return itemAttrs;
-                });
-                const maxKeyWidth = keyWidths.length ? Math.max(...keyWidths) : 0;
-                const maxAdaptiveKeyWidth = adaptiveKeyWidths.length ? Math.max(...adaptiveKeyWidths) : 0;
-                const maxValueWidth = valueWidths.length ? Math.max(...valueWidths) : 0;
-                const shapeWidth = shapeWidths.length ? Math.max(...shapeWidths) + shapeStyle.spacing : 0;
-                maxWidth = Math.max(maxKeyWidth + maxValueWidth + keyStyle.spacing + valueStyle.spacing + shapeWidth, maxAdaptiveKeyWidth + shapeWidth, maxWidth);
-                attribute.hasContentShape = !!shapeWidths.length;
-                attribute.keyWidth = maxKeyWidth;
-                attribute.valueWidth = maxValueWidth;
-            }
-        }
-        const containerSize = {
-            width: maxWidth + padding.left + padding.right,
-            height: containerHeight
-        };
-        attribute.panel.width = containerSize.width;
-        attribute.panel.height = containerSize.height;
-        return attribute;
-    };
-    const measureTooltipText = (text, style) => {
-        var _a;
-        text = (text !== null && text !== void 0 ? text : '').toString();
-        const measure = initTextMeasure(style);
-        if (!style.multiLine) {
-            const { width, height } = measure.fullMeasure(text);
-            return {
-                width,
-                height,
-                text
-            };
+                    shape.stroke = actualShapeStroke !== null && actualShapeStroke !== void 0 ? actualShapeStroke : adaptiveShapeFill;
+                    shape.lineWidth = actualShapeLineWidth;
+                    itemAttrs.shape = shape;
+                    const shapeWidth = actualShapeSize !== null && actualShapeSize !== void 0 ? actualShapeSize : shapeStyle.size;
+                    itemHeight = Math.max(shapeWidth, itemHeight);
+                    shapeWidths.push(shapeWidth);
+                }
+                else {
+                    itemAttrs.shape = { visible: false };
+                }
+                itemAttrs.height = itemHeight;
+                containerHeight += itemHeight;
+                if (i < filteredContent.length - 1) {
+                    containerHeight += itemAttrs.spaceRow;
+                }
+                return itemAttrs;
+            });
+            maxKeyWidth = keyWidths.length ? Math.max(...keyWidths) : 0;
+            maxAdaptiveKeyWidth = adaptiveKeyWidths.length ? Math.max(...adaptiveKeyWidths) : 0;
+            maxValueWidth = valueWidths.length ? Math.max(...valueWidths) : 0;
+            maxShapeWidth = shapeWidths.length ? Math.max(...shapeWidths) + shapeStyle.spacing : 0;
+            contentMaxWidth = Math.max(maxShapeWidth + maxKeyWidth + keyStyle.spacing + maxValueWidth + valueStyle.spacing, maxShapeWidth + maxAdaptiveKeyWidth, contentMaxWidth);
+            attributes.hasContentShape = !!shapeWidths.length;
+            attributes.keyWidth = maxKeyWidth;
+            attributes.valueWidth = maxValueWidth;
+        }
+        let titleMaxWidth = 0;
+        let titleMaxHeight = 0;
+        const { visible: actualTitleVisible = true, value: actualTitleValue = '', valueStyle: actualTitleValueStyle, spaceRow: actualTitleSpaceRow } = title;
+        attributes.title.visible = actualTitleVisible;
+        attributes.title.spaceRow = actualTitleSpaceRow !== null && actualTitleSpaceRow !== void 0 ? actualTitleSpaceRow : commonSpaceRow;
+        let titleValueStyle = {};
+        const isAutoWidthMode = () => titleValueStyle.autoWidth && titleValueStyle.multiLine !== false;
+        if (actualTitleVisible) {
+            titleValueStyle = mergeSpec({}, titleStyle, getTextAttributes(actualTitleValueStyle, undefined, {}));
+            if (isAutoWidthMode()) {
+                titleValueStyle.multiLine = (_c = titleValueStyle.multiLine) !== null && _c !== void 0 ? _c : true;
+                titleValueStyle.maxWidth = (_d = titleValueStyle.maxWidth) !== null && _d !== void 0 ? _d : (hasContent ? Math.ceil(contentMaxWidth) : undefined);
+            }
+            const { text, width, height } = measureTooltipText(actualTitleValue, titleValueStyle);
+            attributes.title.value = Object.assign(Object.assign({ width: isAutoWidthMode() ? Math.min(width, (_e = titleValueStyle.maxWidth) !== null && _e !== void 0 ? _e : Number.MAX_VALUE) : width, height }, titleValueStyle), { text });
+            titleMaxWidth = attributes.title.value.width;
+            titleMaxHeight = attributes.title.value.height;
+            containerHeight += titleMaxHeight + (hasContent ? attributes.title.spaceRow : 0);
+        }
+        attributes.title.width = titleMaxWidth;
+        attributes.title.height = titleMaxHeight;
+        if (isAutoWidthMode()) {
+            containerWidth += contentMaxWidth ? contentMaxWidth : titleMaxWidth;
         }
-        let textLines = text.split('\n');
-        textLines = textLines.map((line, i) => (i < textLines.length - 1 ? line + '\n' : line));
-        const { width, height } = measure.fullMeasure(textLines);
-        if (style.maxWidth && style.maxWidth <= width) {
-            const bound = getRichTextBounds({
-                wordBreak: (_a = style.wordBreak) !== null && _a !== void 0 ? _a : 'break-word',
-                maxWidth: style.maxWidth,
-                width: 0,
-                height: 0,
-                textConfig: textLines.map((line, i) => (Object.assign(Object.assign({}, style), { text: line })))
+        else {
+            containerWidth += Math.max(titleMaxWidth, contentMaxWidth);
+        }
+        if (hasContent) {
+            attributes.content.forEach(item => {
+                var _a;
+                const value = item.value;
+                if (value && ((_a = value.autoWidth) !== null && _a !== void 0 ? _a : true)) {
+                    value.width =
+                        containerWidth -
+                            paddingSpec.left -
+                            paddingSpec.right -
+                            maxShapeWidth -
+                            maxKeyWidth -
+                            keyStyle.spacing -
+                            valueStyle.spacing;
+                    value.multiLine = true;
+                    if (!value.maxWidth) {
+                        value.maxWidth = Math.ceil(value.width);
+                    }
+                    attributes.valueWidth = Math.max(attributes.valueWidth, value.width);
+                }
             });
-            return {
-                width: bound.width(),
-                height: bound.height(),
-                text: textLines
-            };
         }
-        return {
-            width,
-            height,
-            text: textLines
-        };
+        attributes.panel.width = containerWidth;
+        attributes.panel.height = containerHeight;
+        return attributes;
     };
 
     var TooltipResult;
@@ -81777,7 +81857,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         constructor(tooltipId, component) {
             this._visible = true;
             this._id = '';
-            this._attributeCache = null;
+            this._attributes = null;
+            this._isReleased = false;
             this.showTooltip = (activeType, data, params) => {
                 var _a;
                 let changePositionOnly = !!params.changePositionOnly;
@@ -81794,7 +81875,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._changeTooltip = (visible, params, changePositionOnly, activeType, data) => {
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
                 const tooltipSpec = this._component.getSpec();
-                if (!tooltipSpec) {
+                if (this._isReleased || !tooltipSpec) {
                     return TooltipResult.failed;
                 }
                 if (!visible) {
@@ -81844,6 +81925,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             };
             this._changeTooltipPosition = (changePositionOnly, actualTooltip, spec, activeType, data, params) => {
                 var _a, _b, _c;
+                if (this._isReleased) {
+                    return TooltipResult.failed;
+                }
                 const event = params.event;
                 if (spec.handler) {
                     return (_c = (_b = (_a = spec.handler).showTooltip) === null || _b === void 0 ? void 0 : _b.call(_a, activeType, data, params)) !== null && _c !== void 0 ? _c : TooltipResult.success;
@@ -82168,6 +82252,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 return;
             }
             this._removeTooltip();
+            this._isReleased = true;
         }
         _throttle(callback) {
             const tooltipSpec = this._component.getSpec();
@@ -82191,57 +82276,14 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return Object.assign(Object.assign({}, DEFAULT_OPTIONS), { offsetX: (_a = offset === null || offset === void 0 ? void 0 : offset.x) !== null && _a !== void 0 ? _a : DEFAULT_OPTIONS.offsetX, offsetY: (_b = offset === null || offset === void 0 ? void 0 : offset.y) !== null && _b !== void 0 ? _b : DEFAULT_OPTIONS.offsetY });
         }
         _getTooltipBoxSize(actualTooltip, changePositionOnly) {
-            var _a, _b, _c, _d;
-            if (!changePositionOnly || isNil$1(this._attributeCache)) {
-                this._attributeCache = getTooltipAttributes(actualTooltip, this._style);
-            }
-            return {
-                width: (_b = (_a = this._attributeCache) === null || _a === void 0 ? void 0 : _a.panel) === null || _b === void 0 ? void 0 : _b.width,
-                height: (_d = (_c = this._attributeCache) === null || _c === void 0 ? void 0 : _c.panel) === null || _d === void 0 ? void 0 : _d.height
-            };
-        }
-        _getStyle() {
-            var _a, _b, _c, _d, _e;
-            const tooltipSpec = this._component.getSpec();
-            const { style = {}, enterable, transitionDuration } = tooltipSpec;
-            const { panel = {}, titleLabel, shape, keyLabel, valueLabel, spaceRow } = style;
-            const { backgroundColor, border, shadow, padding } = panel;
-            const panelStyle = {
-                lineWidth: (_a = border === null || border === void 0 ? void 0 : border.width) !== null && _a !== void 0 ? _a : 0,
-                shadow: !!shadow
-            };
-            if (border === null || border === void 0 ? void 0 : border.color) {
-                panelStyle.stroke = border.color;
-            }
-            if (backgroundColor) {
-                panelStyle.fill = backgroundColor;
-            }
-            if (shadow) {
-                panelStyle.shadowColor = shadow.color;
-                panelStyle.shadowBlur = shadow.blur;
-                panelStyle.shadowOffsetX = shadow.x;
-                panelStyle.shadowOffsetY = shadow.y;
-                panelStyle.shadowSpread = shadow.spread;
-            }
-            const { radius } = border !== null && border !== void 0 ? border : {};
-            if (isValid$1(radius)) {
-                panelStyle.cornerRadius = [radius, radius, radius, radius];
+            var _a, _b, _c, _d, _e, _f;
+            if (!changePositionOnly || isNil$1(this._attributes)) {
+                const globalTheme = (_b = (_a = this._chartOption).getTheme) === null || _b === void 0 ? void 0 : _b.call(_a);
+                this._attributes = getTooltipAttributes(actualTooltip, this._component.getSpec(), globalTheme);
             }
-            const globalTheme = (_c = (_b = this._chartOption).getTheme) === null || _c === void 0 ? void 0 : _c.call(_b);
             return {
-                panel: panelStyle,
-                title: getTextAttributes(titleLabel, globalTheme),
-                shape: {
-                    fill: true,
-                    size: (_d = shape === null || shape === void 0 ? void 0 : shape.size) !== null && _d !== void 0 ? _d : 8,
-                    spacing: (_e = shape === null || shape === void 0 ? void 0 : shape.spacing) !== null && _e !== void 0 ? _e : 6
-                },
-                key: getTextAttributes(keyLabel, globalTheme),
-                value: getTextAttributes(valueLabel, globalTheme),
-                padding,
-                spaceRow,
-                enterable,
-                transitionDuration
+                width: (_d = (_c = this._attributes) === null || _c === void 0 ? void 0 : _c.panel) === null || _d === void 0 ? void 0 : _d.width,
+                height: (_f = (_e = this._attributes) === null || _e === void 0 ? void 0 : _e.panel) === null || _f === void 0 ? void 0 : _f.height
             };
         }
         _getParentElement(spec) {
@@ -82252,7 +82294,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         _initFromSpec() {
             this._option = this._getDefaultOption();
-            this._style = this._getStyle();
             this.changeTooltip = this._throttle(this._changeTooltip);
             this.changeTooltipPosition = this._throttle(this._changeTooltipPosition);
         }
@@ -82286,22 +82327,24 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         return numArr;
     };
-    function getDomStyles(style, attributeCache) {
-        var _a, _b, _c, _d, _e, _f, _g;
-        const { panel: { fill: fillColor, shadow, shadowBlur, shadowColor, shadowOffsetX, shadowOffsetY, shadowSpread, cornerRadius, stroke: strokeColor, lineWidth = 0 }, padding, key, value, title, shape, enterable, transitionDuration } = style;
-        const { panel: panelAttribute, title: titleAttribute, content: contentAttribute, keyWidth, valueWidth } = attributeCache !== null && attributeCache !== void 0 ? attributeCache : {};
-        const backgroundColor = fillColor;
+    function getDomStyles(attributes) {
+        var _a, _b, _c, _d, _e;
+        const { panel = {}, title: titleAttribute, content: contentAttribute, titleStyle = {}, contentStyle = {}, padding, keyWidth, valueWidth, enterable, transitionDuration } = attributes !== null && attributes !== void 0 ? attributes : {};
+        const { fill: backgroundColor, shadow, shadowBlur, shadowColor, shadowOffsetX, shadowOffsetY, shadowSpread, cornerRadius, stroke: strokeColor, lineWidth = 0, width = 0, height = 0 } = panel;
+        const { value: title = {} } = titleStyle;
+        const { shape = {}, key = {}, value = {} } = contentStyle;
         const shapeStyle = getShapeStyle(shape);
         const keyStyle = getLabelStyle(key);
         const valueStyle = getLabelStyle(value);
+        const { bottom, left, right, top } = normalizeLayoutPaddingSpec(padding);
         const styles = {
             panel: {
-                width: getPixelPropertyStr(((_a = panelAttribute === null || panelAttribute === void 0 ? void 0 : panelAttribute.width) !== null && _a !== void 0 ? _a : 0) + lineWidth * 2),
-                minHeight: getPixelPropertyStr(((_b = panelAttribute === null || panelAttribute === void 0 ? void 0 : panelAttribute.height) !== null && _b !== void 0 ? _b : 0) + lineWidth * 2),
-                paddingBottom: getPixelPropertyStr(padding.bottom),
-                paddingLeft: getPixelPropertyStr(padding.left),
-                paddingRight: getPixelPropertyStr(padding.right),
-                paddingTop: getPixelPropertyStr(padding.top),
+                width: getPixelPropertyStr(width + lineWidth * 2),
+                minHeight: getPixelPropertyStr(height + lineWidth * 2),
+                paddingBottom: getPixelPropertyStr(bottom),
+                paddingLeft: getPixelPropertyStr(left),
+                paddingRight: getPixelPropertyStr(right),
+                paddingTop: getPixelPropertyStr(top),
                 borderColor: strokeColor,
                 borderWidth: getPixelPropertyStr(lineWidth),
                 borderRadius: getPixelPropertyStr(cornerRadius),
@@ -82320,20 +82363,20 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 common: shapeStyle,
                 items: [],
                 width: getPixelPropertyStr(shape.size),
-                marginRight: getPixelPropertyStr((_c = shape.spacing) !== null && _c !== void 0 ? _c : DEFAULT_SHAPE_SPACING),
-                marginBottom: getPixelPropertyStr(-((_e = (_d = contentAttribute === null || contentAttribute === void 0 ? void 0 : contentAttribute[(contentAttribute === null || contentAttribute === void 0 ? void 0 : contentAttribute.length) - 1]) === null || _d === void 0 ? void 0 : _d.spaceRow) !== null && _e !== void 0 ? _e : 0))
+                marginRight: getPixelPropertyStr((_a = shape.spacing) !== null && _a !== void 0 ? _a : DEFAULT_SHAPE_SPACING),
+                marginBottom: getPixelPropertyStr(-((_c = (_b = contentAttribute === null || contentAttribute === void 0 ? void 0 : contentAttribute[(contentAttribute === null || contentAttribute === void 0 ? void 0 : contentAttribute.length) - 1]) === null || _b === void 0 ? void 0 : _b.spaceRow) !== null && _c !== void 0 ? _c : 0))
             },
             keyColumn: {
                 common: keyStyle,
                 items: contentAttribute === null || contentAttribute === void 0 ? void 0 : contentAttribute.map(({ key, spaceRow }, i) => (Object.assign(Object.assign(Object.assign({ marginTop: '0px', marginBottom: i < contentAttribute.length - 1 ? getPixelPropertyStr(spaceRow) : '0px' }, keyStyle), getLabelStyle(key)), ((key === null || key === void 0 ? void 0 : key.multiLine) ? { width: getPixelPropertyStr(Math.ceil(key.width)) } : undefined)))),
                 width: getPixelPropertyStr(keyWidth),
-                marginRight: getPixelPropertyStr((_f = key.spacing) !== null && _f !== void 0 ? _f : DEFAULT_KEY_SPACING)
+                marginRight: getPixelPropertyStr((_d = key.spacing) !== null && _d !== void 0 ? _d : DEFAULT_KEY_SPACING)
             },
             valueColumn: {
                 common: valueStyle,
                 items: contentAttribute === null || contentAttribute === void 0 ? void 0 : contentAttribute.map(({ value, spaceRow }, i) => (Object.assign(Object.assign(Object.assign({ marginTop: '0px', marginBottom: i < contentAttribute.length - 1 ? getPixelPropertyStr(spaceRow) : '0px' }, valueStyle), getLabelStyle(value)), ((value === null || value === void 0 ? void 0 : value.multiLine) ? { width: getPixelPropertyStr(Math.ceil(value.width)) } : undefined)))),
                 width: getPixelPropertyStr(valueWidth),
-                marginRight: getPixelPropertyStr((_g = value.spacing) !== null && _g !== void 0 ? _g : DEFAULT_VALUE_SPACING)
+                marginRight: getPixelPropertyStr((_e = value.spacing) !== null && _e !== void 0 ? _e : DEFAULT_VALUE_SPACING)
             }
         };
         return styles;
@@ -83038,7 +83081,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     valueToHtml: this._option.sanitize,
                     getTooltipStyle: () => this._domStyle,
                     getTooltipActual: () => this._tooltipActual,
-                    getTooltipAttributes: () => this._attributeCache
+                    getTooltipAttributes: () => this._attributes
                 }, [tooltipSpec.className], this.id);
             }
         }
@@ -83069,7 +83112,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
         }
         _initStyle() {
-            this._domStyle = getDomStyles(this._style, this._attributeCache);
+            this._domStyle = getDomStyles(this._attributes);
         }
         _getParentElement(spec) {
             var _a;
@@ -83115,7 +83158,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             if (this._layer) {
                 this._layer.removeAllChild();
             }
-            this._attributeCache = null;
+            this._attributes = null;
         }
         _updateTooltip(visible, params, actualTooltip) {
             this._visible = visible;
@@ -83137,7 +83180,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
             const pos = actualTooltip === null || actualTooltip === void 0 ? void 0 : actualTooltip.position;
             if (!params.changePositionOnly) {
-                this._tooltipComponent.setAttributes(Object.assign(Object.assign({}, this._attributeCache), pos));
+                this._tooltipComponent.setAttributes(Object.assign(Object.assign({}, this._attributes), pos));
             }
             else if (isValid$1(pos)) {
                 this._tooltipComponent.setAttributes(pos);
@@ -88828,6 +88871,28 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         loadPoptip();
     };
 
+    const registerAllEnv = () => {
+        initAllEnv();
+    };
+    const registerBrowserEnv = () => {
+        loadBrowserEnv(container);
+    };
+    const registerLarkEnv = () => {
+        loadFeishuEnv(container);
+    };
+    const registerLynxEnv = () => {
+        loadLynxEnv(container);
+    };
+    const registerNodeEnv = () => {
+        loadNodeEnv(container);
+    };
+    const registerTaroEnv = () => {
+        loadTaroEnv(container);
+    };
+    const registerWXEnv = () => {
+        loadWxEnv(container);
+    };
+
     VChart.useRegisters([
         registerLineChart,
         registerAreaChart,
@@ -88889,6 +88954,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         registerGridLayout,
         registerLayout3d
     ]);
+    VChart.useRegisters([registerAllEnv]);
 
     exports.Arc3dMark = Arc3dMark;
     exports.ArcMark = ArcMark;
@@ -89015,6 +89081,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     exports.WordCloudChart = WordCloudChart;
     exports.WordCloudSeries = WordCloudSeries;
     exports.default = VChart;
+    exports.registerAllEnv = registerAllEnv;
     exports.registerAreaChart = registerAreaChart;
     exports.registerAreaSeries = registerAreaSeries;
     exports.registerBar3dChart = registerBar3dChart;
@@ -89023,6 +89090,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     exports.registerBarSeries = registerBarSeries;
     exports.registerBoxplotChart = registerBoxplotChart;
     exports.registerBoxplotSeries = registerBoxplotSeries;
+    exports.registerBrowserEnv = registerBrowserEnv;
     exports.registerBrush = registerBrush;
     exports.registerCartesianBandAxis = registerCartesianBandAxis;
     exports.registerCartesianCrossHair = registerCartesianCrossHair;
@@ -89055,18 +89123,21 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     exports.registerHistogramChart = registerHistogramChart;
     exports.registerIndicator = registerIndicator;
     exports.registerLabel = registerLabel;
+    exports.registerLarkEnv = registerLarkEnv;
     exports.registerLayout3d = registerLayout3d;
     exports.registerLineChart = registerLineChart;
     exports.registerLineSeries = registerLineSeries;
     exports.registerLinearProgressChart = registerLinearProgressChart;
     exports.registerLinearProgressSeries = registerLinearProgressSeries;
     exports.registerLinkSeries = registerLinkSeries;
+    exports.registerLynxEnv = registerLynxEnv;
     exports.registerMapChart = registerMapChart;
     exports.registerMapLabel = registerMapLabel;
     exports.registerMapSeries = registerMapSeries;
     exports.registerMarkArea = registerMarkArea;
     exports.registerMarkLine = registerMarkLine;
     exports.registerMarkPoint = registerMarkPoint;
+    exports.registerNodeEnv = registerNodeEnv;
     exports.registerPie3dChart = registerPie3dChart;
     exports.registerPie3dSeries = registerPie3dSeries;
     exports.registerPieChart = registerPieChart;
@@ -89094,11 +89165,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
     exports.registerSequenceChart = registerSequenceChart;
     exports.registerSunBurstSeries = registerSunBurstSeries;
     exports.registerSunburstChart = registerSunburstChart;
+    exports.registerTaroEnv = registerTaroEnv;
     exports.registerTitle = registerTitle;
     exports.registerTooltip = registerTooltip;
     exports.registerTotalLabel = registerTotalLabel;
     exports.registerTreemapChart = registerTreemapChart;
     exports.registerTreemapSeries = registerTreemapSeries;
+    exports.registerWXEnv = registerWXEnv;
     exports.registerWaterfallChart = registerWaterfallChart;
     exports.registerWaterfallSeries = registerWaterfallSeries;
     exports.registerWordCloud3dChart = registerWordCloud3dChart;