@visactor/vchart-extension 1.12.15 → 1.13.0

package/build/index.js

@@ -1533,6 +1533,11 @@
       }
     }
 
+    var MeasureModeEnum;
+    !function (MeasureModeEnum) {
+      MeasureModeEnum[MeasureModeEnum.estimate = 0] = "estimate", MeasureModeEnum[MeasureModeEnum.actualBounding = 1] = "actualBounding", MeasureModeEnum[MeasureModeEnum.fontBounding = 2] = "fontBounding";
+    }(MeasureModeEnum || (MeasureModeEnum = {}));
+
     const circleThreshold = vutils.tau - 1e-8;
     class BoundsContext {
       constructor(bounds) {
@@ -2789,6 +2794,7 @@
     const DefaultTextStyle = {
       text: "",
       maxLineWidth: 1 / 0,
+      maxWidth: 1 / 0,
       textAlign: "left",
       textBaseline: "alphabetic",
       fontSize: 16,
@@ -2812,7 +2818,9 @@
       suffixPosition: "end",
       underlineDash: [],
       underlineOffset: 0,
-      disableAutoClipedPoptip: void 0
+      disableAutoClipedPoptip: void 0,
+      measureMode: MeasureModeEnum.fontBounding,
+      keepCenterInLine: !1
     };
     const DefaultPickStyle = {
       pickStrokeBuffer: 0
@@ -3298,19 +3306,19 @@
       }
       insertBefore(newNode, referenceNode) {
         if (!referenceNode) return this.appendChild(newNode);
-        if (this._uid === newNode._uid) return null;
+        if (this === newNode || newNode === referenceNode) return null;
         if (newNode.isAncestorsOf(this)) throw new Error("【Node::insertBefore】不能将父辈元素insert为子元素");
         return referenceNode.parent !== this ? null : (newNode.parent && newNode.parent.removeChild(newNode), newNode.parent = this, newNode._prev = referenceNode._prev, referenceNode._prev ? referenceNode._prev._next = newNode : this._firstChild = newNode, referenceNode._prev = newNode, newNode._next = referenceNode, this._idMap || (this._idMap = new Map()), this._idMap.set(newNode._uid, newNode), this._structEdit = !0, this.setCount(newNode.count), newNode);
       }
       insertAfter(newNode, referenceNode) {
         if (!referenceNode) return this.appendChild(newNode);
-        if (this._uid === newNode._uid) return null;
+        if (this === newNode || newNode === referenceNode) return null;
         if (newNode.isAncestorsOf(this)) throw new Error("【Node::insertAfter】不能将父辈元素insert为子元素");
         return referenceNode.parent !== this ? null : (newNode.parent && newNode.parent.removeChild(newNode), newNode.parent = this, referenceNode._next ? (referenceNode._next._prev = newNode, newNode._next = referenceNode._next) : this._lastChild = newNode, referenceNode._next = newNode, newNode._prev = referenceNode, this._idMap || (this._idMap = new Map()), this._idMap.set(newNode._uid, newNode), this._structEdit = !0, this.setCount(newNode.count), newNode);
       }
       insertInto(newNode, idx) {
         if (!this._ignoreWarn && this._nodeList && vutils.Logger.getInstance().warn("insertIntoKeepIdx和insertInto混用可能会存在错误"), idx >= this.childrenCount) return this.appendChild(newNode);
-        if (this._uid === newNode._uid) return null;
+        if (this === newNode) return null;
         if (newNode.isAncestorsOf(this)) throw new Error("【Node::insertBefore】不能将父辈元素insert为子元素");
         if (newNode.parent && newNode.parent.removeChild(newNode), newNode.parent = this, 0 === idx) newNode._next = this._firstChild, this._firstChild && (this._firstChild._prev = newNode), newNode._prev = null, this._firstChild = newNode;else {
           let child = this._firstChild;
@@ -4184,12 +4192,16 @@
       }
       return points;
     }
-    const calculateLineHeight = (lineHeight, fontSize) => {
+    const _calculateLineHeight = (lineHeight, fontSize) => {
       if (vutils.isString(lineHeight) && "%" === lineHeight[lineHeight.length - 1]) {
         return fontSize * (Number.parseFloat(lineHeight.substring(0, lineHeight.length - 1)) / 100);
       }
       return lineHeight;
     };
+    const calculateLineHeight = (lineHeight, fontSize) => {
+      const _lh = _calculateLineHeight(lineHeight, fontSize);
+      return isNaN(_lh) ? _lh : Math.max(fontSize, _lh);
+    };
 
     var ColorType;
     !function (ColorType) {
@@ -5471,14 +5483,21 @@
           width: width,
           height: height,
           path: path,
-          clip = groupTheme.clip,
-          display: display
+          clip = groupTheme.clip
         } = attribute;
-        return path && path.length ? path.forEach(g => {
+        if (path && path.length ? path.forEach(g => {
           aabbBounds.union(g.AABBBounds);
-        }) : null != width && null != height && aabbBounds.set(0, 0, Math.max(0, width), Math.max(0, height)), clip || this.forEachChildren(node => {
-          aabbBounds.union(node.AABBBounds);
-        }), application.graphicService.updateTempAABBBounds(aabbBounds), application.graphicService.transformAABBBounds(attribute, aabbBounds, groupTheme, !1, this), originalAABBBounds.copy(aabbBounds), originalAABBBounds;
+        }) : null != width && null != height && aabbBounds.set(0, 0, Math.max(0, width), Math.max(0, height)), !clip) {
+          this.forEachChildren(node => {
+            aabbBounds.union(node.AABBBounds);
+          });
+          const {
+            scrollX = 0,
+            scrollY = 0
+          } = attribute;
+          aabbBounds.translate(scrollX, scrollY);
+        }
+        return application.graphicService.updateTempAABBBounds(aabbBounds), application.graphicService.transformAABBBounds(attribute, aabbBounds, groupTheme, !1, this), originalAABBBounds.copy(aabbBounds), originalAABBBounds;
       }
       doUpdateAABBBounds() {
         this.updateAABBBoundsStamp++;
@@ -5826,7 +5845,8 @@
           onAddIncremental: new SyncHook(["graphic", "group", "stage"]),
           onClearIncremental: new SyncHook(["graphic", "group", "stage"]),
           beforeUpdateAABBBounds: new SyncHook(["graphic", "stage", "willUpdate", "aabbBounds"]),
-          afterUpdateAABBBounds: new SyncHook(["graphic", "stage", "aabbBounds", "globalAABBBounds", "selfChange"])
+          afterUpdateAABBBounds: new SyncHook(["graphic", "stage", "aabbBounds", "globalAABBBounds", "selfChange"]),
+          clearAABBBounds: new SyncHook(["graphic", "stage", "aabbBounds"])
         }, this.tempAABBBounds1 = new vutils.AABBBounds(), this.tempAABBBounds2 = new vutils.AABBBounds();
       }
       onAttributeUpdate(graphic) {
@@ -5853,6 +5873,9 @@
       afterUpdateAABBBounds(graphic, stage, bounds, params, selfChange) {
         this.hooks.afterUpdateAABBBounds.taps.length && this.hooks.afterUpdateAABBBounds.call(graphic, stage, bounds, params, selfChange);
       }
+      clearAABBBounds(graphic, stage, b) {
+        this.hooks.clearAABBBounds.taps.length && this.hooks.clearAABBBounds.call(graphic, stage, b);
+      }
       updatePathProxyAABBBounds(aabbBounds, graphic) {
         const path = "function" == typeof graphic.pathProxy ? graphic.pathProxy(graphic.attribute) : graphic.pathProxy;
         if (!path) return !1;
@@ -5915,12 +5938,11 @@
       validCheck(attribute, theme, aabbBounds, graphic) {
         if (!graphic) return !0;
         if (null != attribute.forceBoundsHeight || null != attribute.forceBoundsWidth) return !0;
-        if (graphic.shadowRoot) return !0;
-        if (!graphic.valid) return aabbBounds.clear(), !1;
+        if (graphic.shadowRoot || graphic.isContainer) return !0;
         const {
           visible = theme.visible
         } = attribute;
-        return !!visible || (aabbBounds.clear(), !1);
+        return !(!graphic.valid || !visible) || (aabbBounds.empty() || (graphic.parent && aabbBounds.transformWithMatrix(graphic.parent.globalTransMatrix), application.graphicService.clearAABBBounds(graphic, graphic.stage, aabbBounds), aabbBounds.clear()), !1);
       }
       updateTempAABBBounds(aabbBounds) {
         const tb1 = this.tempAABBBounds1,
@@ -6804,58 +6826,64 @@
       constructor(fontFamily, options, textMeasure) {
         this.fontFamily = fontFamily, this.textOptions = options, this.textMeasure = textMeasure;
       }
-      LayoutBBox(bbox, textAlign, textBaseline) {
-        if ("left" === textAlign || "start" === textAlign) bbox.xOffset = 0;else if ("center" === textAlign) bbox.xOffset = bbox.width / -2;else {
-          if ("right" !== textAlign && "end" !== textAlign) throw new Error("非法的textAlign");
-          bbox.xOffset = -bbox.width;
-        }
-        return bbox.yOffset = "top" === textBaseline ? 0 : "middle" === textBaseline ? bbox.height / -2 : "alphabetic" === textBaseline ? -.79 * bbox.height : -bbox.height, bbox;
-      }
-      GetLayout(str, width, height, textAlign, textBaseline, lineHeight, suffix, wordBreak, suffixPosition) {
-        const linesLayout = [],
-          bboxWH = [width, height],
-          bboxOffset = [0, 0];
-        for (; str.length > 0;) {
-          const {
-            str: clipText
-          } = this.textMeasure.clipTextWithSuffix(str, this.textOptions, width, suffix, wordBreak, suffixPosition);
-          linesLayout.push({
-            str: clipText,
-            width: this.textMeasure.measureTextWidth(clipText, this.textOptions)
-          }), str = str.substring(clipText.length);
-        }
-        "left" === textAlign || "start" === textAlign || ("center" === textAlign ? bboxOffset[0] = bboxWH[0] / -2 : "right" !== textAlign && "end" !== textAlign || (bboxOffset[0] = -bboxWH[0])), "top" === textBaseline || ("middle" === textBaseline ? bboxOffset[1] = bboxWH[1] / -2 : "bottom" === textBaseline && (bboxOffset[1] = -bboxWH[1]));
-        const bbox = {
-          xOffset: bboxOffset[0],
-          yOffset: bboxOffset[1],
-          width: bboxWH[0],
-          height: bboxWH[1]
-        };
-        return this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
+      LayoutBBox(bbox, textAlign, textBaseline, linesLayout) {
+        if (bbox.xOffset = "left" === textAlign || "start" === textAlign ? 0 : "center" === textAlign ? bbox.width / -2 : "right" === textAlign || "end" === textAlign ? -bbox.width : 0, "top" === textBaseline) bbox.yOffset = 0;else if ("middle" === textBaseline) bbox.yOffset = bbox.height / -2;else if ("alphabetic" === textBaseline) {
+          let percent = .79;
+          if (1 === linesLayout.length) {
+            const lineInfo = linesLayout[0];
+            percent = lineInfo.ascent / (lineInfo.ascent + lineInfo.descent);
+          }
+          bbox.yOffset = bbox.height * -percent;
+        } else bbox.yOffset = -bbox.height;
+        return bbox;
       }
       GetLayoutByLines(lines, textAlign, textBaseline, lineHeight) {
         let suffix = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : "";
         let wordBreak = arguments.length > 5 ? arguments[5] : undefined;
-        let lineWidth = arguments.length > 6 ? arguments[6] : undefined;
-        let suffixPosition = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : "end";
+        let params = arguments.length > 6 ? arguments[6] : undefined;
+        const {
+          lineWidth: lineWidth,
+          suffixPosition = "end",
+          measureMode = MeasureModeEnum.actualBounding,
+          keepCenterInLine = !1
+        } = null != params ? params : {};
         lines = lines.map(l => l.toString());
         const linesLayout = [],
           bboxWH = [0, 0];
         if ("number" == typeof lineWidth && lineWidth !== 1 / 0) {
           let width;
-          for (let i = 0, len = lines.length; i < len; i++) width = Math.min(this.textMeasure.measureTextWidth(lines[i], this.textOptions), lineWidth), linesLayout.push({
-            str: this.textMeasure.clipTextWithSuffix(lines[i], this.textOptions, width, suffix, wordBreak, suffixPosition).str,
-            width: width
-          });
+          for (let i = 0, len = lines.length; i < len; i++) {
+            const metrics = this.textMeasure.measureTextPixelADscentAndWidth(lines[i], this.textOptions, measureMode);
+            let str = lines[i].toString();
+            if (metrics.width > lineWidth) {
+              const data = this.textMeasure.clipTextWithSuffix(lines[i], this.textOptions, lineWidth, suffix, wordBreak, suffixPosition);
+              str = data.str, width = data.width;
+            } else width = metrics.width;
+            linesLayout.push({
+              str: str,
+              width: width,
+              ascent: metrics.ascent,
+              descent: metrics.descent,
+              keepCenterInLine: keepCenterInLine
+            });
+          }
           bboxWH[0] = lineWidth;
         } else {
-          let width, text;
-          lineWidth = 0;
-          for (let i = 0, len = lines.length; i < len; i++) text = lines[i], width = this.textMeasure.measureTextWidth(text, this.textOptions), lineWidth = Math.max(lineWidth, width), linesLayout.push({
-            str: text,
-            width: width
-          });
-          bboxWH[0] = lineWidth;
+          let width,
+            text,
+            _lineWidth = 0;
+          for (let i = 0, len = lines.length; i < len; i++) {
+            text = lines[i];
+            const metrics = this.textMeasure.measureTextPixelADscentAndWidth(lines[i], this.textOptions, measureMode);
+            width = metrics.width, _lineWidth = Math.max(_lineWidth, width), linesLayout.push({
+              str: text,
+              width: width,
+              ascent: metrics.ascent,
+              descent: metrics.descent,
+              keepCenterInLine: keepCenterInLine
+            });
+          }
+          bboxWH[0] = _lineWidth;
         }
         bboxWH[1] = linesLayout.length * lineHeight, bboxWH[0] = linesLayout.reduce((a, b) => Math.max(a, b.width), 0);
         const bbox = {
@@ -6864,7 +6892,7 @@
           width: bboxWH[0],
           height: bboxWH[1]
         };
-        return this.LayoutBBox(bbox, textAlign, textBaseline), this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
+        return this.LayoutBBox(bbox, textAlign, textBaseline, linesLayout), this.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
       }
       layoutWithBBox(bbox, lines, textAlign, textBaseline, lineHeight) {
         const origin = [0, 0],
@@ -6883,11 +6911,19 @@
         };
       }
       lineOffset(bbox, line, textAlign, textBaseline, lineHeight, origin) {
-        return "left" === textAlign || "start" === textAlign ? line.leftOffset = 0 : "center" === textAlign ? line.leftOffset = (bbox.width - line.width) / 2 : "right" !== textAlign && "end" !== textAlign || (line.leftOffset = bbox.width - line.width), line.topOffset = (lineHeight - this.textOptions.fontSize) / 2 + .79 * this.textOptions.fontSize + origin[1], origin[1] += lineHeight, line;
+        if ("left" === textAlign || "start" === textAlign ? line.leftOffset = 0 : "center" === textAlign ? line.leftOffset = (bbox.width - line.width) / 2 : "right" !== textAlign && "end" !== textAlign || (line.leftOffset = bbox.width - line.width), line.topOffset = lineHeight / 2 + (line.ascent - line.descent) / 2 + origin[1], !line.keepCenterInLine) {
+          const buf = 0,
+            actualHeightWithBuf = line.ascent + line.descent + buf;
+          if (actualHeightWithBuf < lineHeight - buf && ("bottom" === textBaseline ? line.topOffset += (lineHeight - actualHeightWithBuf) / 2 : "top" === textBaseline && (line.topOffset -= (lineHeight - actualHeightWithBuf) / 2)), "alphabetic" === textBaseline) {
+            const ratio = lineHeight / (line.ascent + line.descent);
+            line.topOffset = lineHeight / 2 + (line.ascent - line.descent) / 2 * ratio + origin[1];
+          }
+        }
+        return origin[1] += lineHeight, line;
       }
     }
 
-    const TEXT_UPDATE_TAG_KEY = ["text", "maxLineWidth", "textAlign", "textBaseline", "heightLimit", "lineClamp", "fontSize", "fontFamily", "fontWeight", "ellipsis", "lineHeight", "direction", "wordBreak", "heightLimit", "lineClamp", ...GRAPHIC_UPDATE_TAG_KEY];
+    const TEXT_UPDATE_TAG_KEY = ["text", "maxLineWidth", "maxWidth", "textAlign", "textBaseline", "heightLimit", "lineClamp", "fontSize", "fontFamily", "fontWeight", "ellipsis", "lineHeight", "direction", "wordBreak", "heightLimit", "lineClamp", ...GRAPHIC_UPDATE_TAG_KEY];
     class Text extends Graphic {
       get font() {
         const textTheme = this.getGraphicTheme();
@@ -6896,26 +6932,22 @@
       get clipedText() {
         var _a;
         const attribute = this.attribute,
-          textTheme = this.getGraphicTheme();
-        if (!this.isSimplify()) return;
-        const {
-          maxLineWidth = textTheme.maxLineWidth
-        } = attribute;
-        return Number.isFinite(maxLineWidth) ? (this.tryUpdateAABBBounds(), this.cache.clipedText) : (null !== (_a = attribute.text) && void 0 !== _a ? _a : textTheme.text).toString();
+          textTheme = this.getGraphicTheme(),
+          maxWidth = this.getMaxWidth(textTheme);
+        return Number.isFinite(maxWidth) ? (this.tryUpdateAABBBounds(), this.cache.clipedText) : (null !== (_a = attribute.text) && void 0 !== _a ? _a : textTheme.text).toString();
       }
       get clipedWidth() {
-        if (this.isSimplify()) return this.tryUpdateAABBBounds(), this.cache.clipedWidth;
+        return this.tryUpdateAABBBounds(), this.cache.clipedWidth;
       }
       get cliped() {
         var _a, _b;
         const textTheme = this.getGraphicTheme(),
           attribute = this.attribute,
-          {
-            maxLineWidth = textTheme.maxLineWidth,
-            text: text,
-            whiteSpace = textTheme.whiteSpace
-          } = attribute;
-        if (!Number.isFinite(maxLineWidth)) return !1;
+          maxWidth = this.getMaxWidth(textTheme);
+        if (!Number.isFinite(maxWidth)) return !1;
+        const {
+          text: text
+        } = this.attribute;
         if (this.tryUpdateAABBBounds(), null === (_b = null === (_a = this.cache) || void 0 === _a ? void 0 : _a.layoutData) || void 0 === _b ? void 0 : _b.lines) {
           let mergedText = "";
           this.cache.layoutData.lines.forEach(item => {
@@ -6926,10 +6958,7 @@
         return "vertical" === attribute.direction && this.cache.verticalList && this.cache.verticalList[0] ? this.cache.verticalList[0].map(item => item.text).join("") !== attribute.text.toString() : null != this.clipedText && this.clipedText !== attribute.text.toString();
       }
       get multilineLayout() {
-        if (this.isMultiLine) return this.tryUpdateAABBBounds(), this.cache.layoutData;
-      }
-      isSimplify() {
-        return !this.isMultiLine && "vertical" !== this.attribute.direction;
+        return this.tryUpdateAABBBounds(), this.cache.layoutData;
       }
       get isMultiLine() {
         return Array.isArray(this.attribute.text) || "normal" === this.attribute.whiteSpace;
@@ -7002,8 +7031,74 @@
         }
         return application.graphicService.combindShadowAABBBounds(aabbBounds, this), null == attribute.forceBoundsHeight && null == attribute.forceBoundsWidth || application.graphicService.updateHTMLTextAABBBounds(attribute, textTheme, aabbBounds), vutils.transformBoundsWithMatrix(aabbBounds, aabbBounds, this.transMatrix), aabbBounds;
       }
+      updateSingallineAABBBounds(text) {
+        this.updateMultilineAABBBounds([text]);
+        const layoutData = this.cache.layoutData;
+        if (layoutData && layoutData.lines && layoutData.lines.length) {
+          const line = layoutData.lines[0];
+          this.cache.clipedText = line.str, this.cache.clipedWidth = line.width;
+        }
+        return this._AABBBounds;
+      }
+      updateMultilineAABBBounds(text) {
+        const textTheme = this.getGraphicTheme(),
+          {
+            direction = textTheme.direction,
+            underlineOffset = textTheme.underlineOffset
+          } = this.attribute,
+          b = "horizontal" === direction ? this.updateHorizontalMultilineAABBBounds(text) : this.updateVerticalMultilineAABBBounds(text);
+        return "horizontal" === direction && underlineOffset && this._AABBBounds.add(this._AABBBounds.x1, this._AABBBounds.y2 + underlineOffset), b;
+      }
+      guessLineHeightBuf(fontSize) {
+        return fontSize ? .1 * fontSize : 0;
+      }
+      updateHorizontalMultilineAABBBounds(text) {
+        var _a;
+        const textTheme = this.getGraphicTheme(),
+          attribute = this.attribute,
+          {
+            fontFamily = textTheme.fontFamily,
+            textAlign = textTheme.textAlign,
+            textBaseline = textTheme.textBaseline,
+            fontSize = textTheme.fontSize,
+            fontWeight = textTheme.fontWeight,
+            ellipsis = textTheme.ellipsis,
+            maxLineWidth: maxLineWidth,
+            stroke = textTheme.stroke,
+            wrap = textTheme.wrap,
+            measureMode = textTheme.measureMode,
+            lineWidth = textTheme.lineWidth,
+            whiteSpace = textTheme.whiteSpace,
+            suffixPosition = textTheme.suffixPosition,
+            ignoreBuf = textTheme.ignoreBuf,
+            keepCenterInLine = textTheme.keepCenterInLine
+          } = attribute,
+          buf = ignoreBuf ? 0 : this.guessLineHeightBuf(fontSize),
+          lineHeight = this.getLineHeight(attribute, textTheme, buf);
+        if ("normal" === whiteSpace || wrap) return this.updateWrapAABBBounds(text);
+        if (!this.shouldUpdateShape() && (null === (_a = this.cache) || void 0 === _a ? void 0 : _a.layoutData)) {
+          const bbox = this.cache.layoutData.bbox;
+          return this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
+        }
+        const textMeasure = application.graphicUtil.textMeasure,
+          layoutData = new CanvasTextLayout(fontFamily, {
+            fontSize: fontSize,
+            fontWeight: fontWeight,
+            fontFamily: fontFamily,
+            lineHeight: lineHeight
+          }, textMeasure).GetLayoutByLines(text, textAlign, textBaseline, lineHeight, !0 === ellipsis ? textTheme.ellipsis : ellipsis || void 0, !1, {
+            lineWidth: maxLineWidth,
+            suffixPosition: suffixPosition,
+            measureMode: measureMode,
+            keepCenterInLine: keepCenterInLine
+          }),
+          {
+            bbox: bbox
+          } = layoutData;
+        return this.cache.layoutData = layoutData, this.clearUpdateShapeTag(), this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
+      }
       updateWrapAABBBounds(text) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
         const textTheme = this.getGraphicTheme(),
           {
             fontFamily = textTheme.fontFamily,
@@ -7017,22 +7112,26 @@
             wordBreak = textTheme.wordBreak,
             fontWeight = textTheme.fontWeight,
             ignoreBuf = textTheme.ignoreBuf,
+            measureMode = textTheme.measureMode,
             suffixPosition = textTheme.suffixPosition,
             heightLimit = 0,
-            lineClamp: lineClamp
+            lineClamp: lineClamp,
+            keepCenterInLine = textTheme.keepCenterInLine
           } = this.attribute,
-          lineHeight = null !== (_a = calculateLineHeight(this.attribute.lineHeight, this.attribute.fontSize || textTheme.fontSize)) && void 0 !== _a ? _a : this.attribute.fontSize || textTheme.fontSize,
-          buf = ignoreBuf ? 0 : 2;
-        if (!this.shouldUpdateShape() && (null === (_b = this.cache) || void 0 === _b ? void 0 : _b.layoutData)) {
+          buf = ignoreBuf ? 0 : this.guessLineHeightBuf(fontSize),
+          lineHeight = this.getLineHeight(this.attribute, textTheme, buf);
+        if (!this.shouldUpdateShape() && (null === (_a = this.cache) || void 0 === _a ? void 0 : _a.layoutData)) {
           const bbox = this.cache.layoutData.bbox;
           return this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
         }
         const textMeasure = application.graphicUtil.textMeasure,
-          layoutObj = new CanvasTextLayout(fontFamily, {
+          textOptions = {
             fontSize: fontSize,
             fontWeight: fontWeight,
-            fontFamily: fontFamily
-          }, textMeasure),
+            fontFamily: fontFamily,
+            lineHeight: lineHeight
+          },
+          layoutObj = new CanvasTextLayout(fontFamily, textOptions, textMeasure),
           lines = vutils.isArray(text) ? text.map(l => l.toString()) : [text.toString()],
           linesLayout = [],
           bboxWH = [0, 0];
@@ -7042,24 +7141,32 @@
             const str = lines[i];
             let needCut = !0;
             if (i === lineCountLimit - 1) {
-              const clip = layoutObj.textMeasure.clipTextWithSuffix(str, layoutObj.textOptions, maxLineWidth, ellipsis, !1, suffixPosition, i !== lines.length - 1);
+              const clip = textMeasure.clipTextWithSuffix(str, textOptions, maxLineWidth, ellipsis, !1, suffixPosition, i !== lines.length - 1),
+                matrics = textMeasure.measureTextPixelADscentAndWidth(clip.str, textOptions, measureMode);
               linesLayout.push({
                 str: clip.str,
-                width: clip.width
+                width: clip.width,
+                ascent: matrics.ascent,
+                descent: matrics.descent,
+                keepCenterInLine: keepCenterInLine
               });
               break;
             }
-            const clip = layoutObj.textMeasure.clipText(str, layoutObj.textOptions, maxLineWidth, "break-all" !== wordBreak, "keep-all" === wordBreak);
+            const clip = textMeasure.clipText(str, textOptions, maxLineWidth, "break-all" !== wordBreak, "keep-all" === wordBreak);
             if ("" !== str && "" === clip.str || clip.wordBreaked) {
               if (ellipsis) {
-                const clipEllipsis = layoutObj.textMeasure.clipTextWithSuffix(str, layoutObj.textOptions, maxLineWidth, ellipsis, !1, suffixPosition);
-                clip.str = null !== (_c = clipEllipsis.str) && void 0 !== _c ? _c : "", clip.width = null !== (_d = clipEllipsis.width) && void 0 !== _d ? _d : 0;
+                const clipEllipsis = textMeasure.clipTextWithSuffix(str, textOptions, maxLineWidth, ellipsis, !1, suffixPosition);
+                clip.str = null !== (_b = clipEllipsis.str) && void 0 !== _b ? _b : "", clip.width = null !== (_c = clipEllipsis.width) && void 0 !== _c ? _c : 0;
               } else clip.str = "", clip.width = 0;
               needCut = !1;
             }
+            const matrics = textMeasure.measureTextPixelADscentAndWidth(clip.str, textOptions, measureMode);
             linesLayout.push({
               str: clip.str,
-              width: clip.width
+              width: clip.width,
+              ascent: matrics.ascent,
+              descent: matrics.descent,
+              keepCenterInLine: keepCenterInLine
             });
             let cutLength = clip.str.length;
             if (!clip.wordBreaked || "" !== str && "" === clip.str || (needCut = !0, cutLength = clip.wordBreaked), clip.str.length === str.length) ;else if (needCut) {
@@ -7077,235 +7184,46 @@
             lineWidth = 0;
           for (let i = 0, len = lines.length; i < len; i++) {
             if (i === lineCountLimit - 1) {
-              const clip = layoutObj.textMeasure.clipTextWithSuffix(lines[i], layoutObj.textOptions, maxLineWidth, ellipsis, !1, suffixPosition);
+              const clip = textMeasure.clipTextWithSuffix(lines[i], textOptions, maxLineWidth, ellipsis, !1, suffixPosition),
+                matrics = textMeasure.measureTextPixelADscentAndWidth(clip.str, textOptions, measureMode);
               linesLayout.push({
                 str: clip.str,
-                width: clip.width
+                width: clip.width,
+                ascent: matrics.ascent,
+                descent: matrics.descent,
+                keepCenterInLine: keepCenterInLine
               }), lineWidth = Math.max(lineWidth, clip.width);
               break;
             }
-            text = lines[i], width = layoutObj.textMeasure.measureTextWidth(text, layoutObj.textOptions, "break-word" === wordBreak), lineWidth = Math.max(lineWidth, width), linesLayout.push({
+            text = lines[i], width = textMeasure.measureTextWidth(text, textOptions), lineWidth = Math.max(lineWidth, width);
+            const matrics = textMeasure.measureTextPixelADscentAndWidth(text, textOptions, measureMode);
+            linesLayout.push({
               str: text,
-              width: width
+              width: width,
+              ascent: matrics.ascent,
+              descent: matrics.descent,
+              keepCenterInLine: keepCenterInLine
             });
           }
           bboxWH[0] = lineWidth;
         }
-        bboxWH[1] = linesLayout.length * (lineHeight + buf);
+        bboxWH[1] = linesLayout.length * lineHeight;
         const bbox = {
           xOffset: 0,
           yOffset: 0,
           width: bboxWH[0],
           height: bboxWH[1]
         };
-        layoutObj.LayoutBBox(bbox, textAlign, textBaseline);
+        layoutObj.LayoutBBox(bbox, textAlign, textBaseline, linesLayout);
         const layoutData = layoutObj.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
         return this.cache.layoutData = layoutData, this.clearUpdateShapeTag(), this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
       }
-      updateSingallineAABBBounds(text) {
-        const textTheme = this.getGraphicTheme(),
-          {
-            direction = textTheme.direction,
-            underlineOffset = textTheme.underlineOffset
-          } = this.attribute,
-          b = "horizontal" === direction ? this.updateHorizontalSinglelineAABBBounds(text) : this.updateVerticalSinglelineAABBBounds(text);
-        return "horizontal" === direction && underlineOffset && this._AABBBounds.add(this._AABBBounds.x1, this._AABBBounds.y2 + underlineOffset), b;
-      }
-      updateMultilineAABBBounds(text) {
-        const textTheme = this.getGraphicTheme(),
-          {
-            direction = textTheme.direction,
-            underlineOffset = textTheme.underlineOffset
-          } = this.attribute,
-          b = "horizontal" === direction ? this.updateHorizontalMultilineAABBBounds(text) : this.updateVerticalMultilineAABBBounds(text);
-        return "horizontal" === direction && underlineOffset && this._AABBBounds.add(this._AABBBounds.x1, this._AABBBounds.y2 + underlineOffset), b;
-      }
-      updateHorizontalSinglelineAABBBounds(text) {
-        var _a, _b;
-        const textTheme = this.getGraphicTheme(),
-          {
-            wrap = textTheme.wrap
-          } = this.attribute;
-        if (wrap) return this.updateWrapAABBBounds([text]);
-        const textMeasure = application.graphicUtil.textMeasure;
-        let width, str;
-        const attribute = this.attribute,
-          {
-            maxLineWidth = textTheme.maxLineWidth,
-            ellipsis = textTheme.ellipsis,
-            textAlign = textTheme.textAlign,
-            textBaseline = textTheme.textBaseline,
-            fontFamily = textTheme.fontFamily,
-            fontSize = textTheme.fontSize,
-            fontWeight = textTheme.fontWeight,
-            stroke = textTheme.stroke,
-            lineWidth = textTheme.lineWidth,
-            ignoreBuf = textTheme.ignoreBuf,
-            whiteSpace = textTheme.whiteSpace,
-            suffixPosition = textTheme.suffixPosition
-          } = attribute;
-        if ("normal" === whiteSpace) return this.updateWrapAABBBounds(text);
-        const buf = ignoreBuf ? 0 : Math.max(2, .075 * fontSize),
-          textFontSize = attribute.fontSize || textTheme.fontSize,
-          lineHeight = null !== (_a = calculateLineHeight(attribute.lineHeight, textFontSize)) && void 0 !== _a ? _a : textFontSize + buf;
-        if (!this.shouldUpdateShape() && this.cache) {
-          width = null !== (_b = this.cache.clipedWidth) && void 0 !== _b ? _b : 0;
-          const dx = textDrawOffsetX(textAlign, width),
-            dy = textLayoutOffsetY(textBaseline, lineHeight, fontSize);
-          return this._AABBBounds.set(dx, dy, dx + width, dy + lineHeight), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
-        }
-        if (Number.isFinite(maxLineWidth)) {
-          if (ellipsis) {
-            const strEllipsis = !0 === ellipsis ? textTheme.ellipsis : ellipsis,
-              data = textMeasure.clipTextWithSuffix(text.toString(), {
-                fontSize: fontSize,
-                fontWeight: fontWeight,
-                fontFamily: fontFamily
-              }, maxLineWidth, strEllipsis, !1, suffixPosition);
-            str = data.str, width = data.width;
-          } else {
-            const data = textMeasure.clipText(text.toString(), {
-              fontSize: fontSize,
-              fontWeight: fontWeight,
-              fontFamily: fontFamily
-            }, maxLineWidth, !1);
-            str = data.str, width = data.width;
-          }
-          this.cache.clipedText = str, this.cache.clipedWidth = width;
-        } else width = textMeasure.measureTextWidth(text.toString(), {
-          fontSize: fontSize,
-          fontWeight: fontWeight,
-          fontFamily: fontFamily
-        }), this.cache.clipedText = text.toString(), this.cache.clipedWidth = width;
-        this.clearUpdateShapeTag();
-        const dx = textDrawOffsetX(textAlign, width);
-        let lh = lineHeight;
-        application.global && application.global.isSafari() && (lh += .2 * fontSize);
-        const dy = textLayoutOffsetY(textBaseline, lh, fontSize, buf);
-        return this._AABBBounds.set(dx, dy, dx + width, dy + lh), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
-      }
-      getBaselineMapAlign() {
-        return Text.baselineMapAlign;
-      }
-      getAlignMapBaseline() {
-        return Text.alignMapBaseline;
-      }
-      updateVerticalSinglelineAABBBounds(text) {
-        var _a, _b, _c;
-        const textTheme = this.getGraphicTheme(),
-          textMeasure = application.graphicUtil.textMeasure;
-        let width;
-        const attribute = this.attribute,
-          {
-            ignoreBuf = textTheme.ignoreBuf
-          } = attribute,
-          buf = ignoreBuf ? 0 : 2,
-          {
-            maxLineWidth = textTheme.maxLineWidth,
-            ellipsis = textTheme.ellipsis,
-            fontSize = textTheme.fontSize,
-            fontWeight = textTheme.fontWeight,
-            fontFamily = textTheme.fontFamily,
-            stroke = textTheme.stroke,
-            lineWidth = textTheme.lineWidth,
-            verticalMode = textTheme.verticalMode,
-            suffixPosition = textTheme.suffixPosition
-          } = attribute,
-          lineHeight = null !== (_a = calculateLineHeight(attribute.lineHeight, attribute.fontSize || textTheme.fontSize)) && void 0 !== _a ? _a : (attribute.fontSize || textTheme.fontSize) + buf;
-        let {
-          textAlign = textTheme.textAlign,
-          textBaseline = textTheme.textBaseline
-        } = attribute;
-        if (!verticalMode) {
-          const t = textAlign;
-          textAlign = null !== (_b = Text.baselineMapAlign[textBaseline]) && void 0 !== _b ? _b : "left", textBaseline = null !== (_c = Text.alignMapBaseline[t]) && void 0 !== _c ? _c : "top";
-        }
-        if (!this.shouldUpdateShape() && this.cache) {
-          width = this.cache.clipedWidth;
-          const dx = textDrawOffsetX(textAlign, width),
-            dy = textLayoutOffsetY(textBaseline, lineHeight, fontSize);
-          return this._AABBBounds.set(dy, dx, dy + lineHeight, dx + width), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
-        }
-        let verticalList = [verticalLayout(text.toString())];
-        if (Number.isFinite(maxLineWidth)) {
-          if (ellipsis) {
-            const strEllipsis = !0 === ellipsis ? textTheme.ellipsis : ellipsis,
-              data = textMeasure.clipTextWithSuffixVertical(verticalList[0], {
-                fontSize: fontSize,
-                fontWeight: fontWeight,
-                fontFamily: fontFamily
-              }, maxLineWidth, strEllipsis, !1, suffixPosition);
-            verticalList = [data.verticalList], width = data.width;
-          } else {
-            const data = textMeasure.clipTextVertical(verticalList[0], {
-              fontSize: fontSize,
-              fontWeight: fontWeight,
-              fontFamily: fontFamily
-            }, maxLineWidth, !1);
-            verticalList = [data.verticalList], width = data.width;
-          }
-          this.cache.verticalList = verticalList, this.cache.clipedWidth = width;
-        } else width = 0, verticalList[0].forEach(t => {
-          const w = t.direction === TextDirection.HORIZONTAL ? fontSize : textMeasure.measureTextWidth(t.text, {
-            fontSize: fontSize,
-            fontWeight: fontWeight,
-            fontFamily: fontFamily
-          });
-          width += w, t.width = w;
-        }), this.cache.verticalList = verticalList, this.cache.clipedWidth = width;
-        this.clearUpdateShapeTag();
-        const dx = textDrawOffsetX(textAlign, width),
-          dy = textLayoutOffsetY(textBaseline, lineHeight, fontSize);
-        return this._AABBBounds.set(dy, dx, dy + lineHeight, dx + width), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
-      }
-      updateHorizontalMultilineAABBBounds(text) {
-        var _a, _b;
-        const textTheme = this.getGraphicTheme(),
-          {
-            wrap = textTheme.wrap
-          } = this.attribute;
-        if (wrap) return this.updateWrapAABBBounds(text);
-        const attribute = this.attribute,
-          {
-            fontFamily = textTheme.fontFamily,
-            textAlign = textTheme.textAlign,
-            textBaseline = textTheme.textBaseline,
-            fontSize = textTheme.fontSize,
-            fontWeight = textTheme.fontWeight,
-            ellipsis = textTheme.ellipsis,
-            maxLineWidth: maxLineWidth,
-            stroke = textTheme.stroke,
-            lineWidth = textTheme.lineWidth,
-            whiteSpace = textTheme.whiteSpace,
-            suffixPosition = textTheme.suffixPosition
-          } = attribute,
-          lineHeight = null !== (_a = calculateLineHeight(attribute.lineHeight, attribute.fontSize || textTheme.fontSize)) && void 0 !== _a ? _a : attribute.fontSize || textTheme.fontSize;
-        if ("normal" === whiteSpace) return this.updateWrapAABBBounds(text);
-        if (!this.shouldUpdateShape() && (null === (_b = this.cache) || void 0 === _b ? void 0 : _b.layoutData)) {
-          const bbox = this.cache.layoutData.bbox;
-          return this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
-        }
-        const textMeasure = application.graphicUtil.textMeasure,
-          layoutData = new CanvasTextLayout(fontFamily, {
-            fontSize: fontSize,
-            fontWeight: fontWeight,
-            fontFamily: fontFamily
-          }, textMeasure).GetLayoutByLines(text, textAlign, textBaseline, lineHeight, !0 === ellipsis ? textTheme.ellipsis : ellipsis || void 0, !1, maxLineWidth, suffixPosition),
-          {
-            bbox: bbox
-          } = layoutData;
-        return this.cache.layoutData = layoutData, this.clearUpdateShapeTag(), this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
-      }
       updateVerticalMultilineAABBBounds(text) {
-        var _a, _b, _c;
+        var _a, _b;
         const textTheme = this.getGraphicTheme(),
           textMeasure = application.graphicUtil.textMeasure;
         let width;
         const attribute = this.attribute,
-          {
-            ignoreBuf = textTheme.ignoreBuf
-          } = attribute,
-          buf = ignoreBuf ? 0 : 2,
           {
             maxLineWidth = textTheme.maxLineWidth,
             ellipsis = textTheme.ellipsis,
@@ -7317,14 +7235,14 @@
             verticalMode = textTheme.verticalMode,
             suffixPosition = textTheme.suffixPosition
           } = attribute,
-          lineHeight = null !== (_a = calculateLineHeight(attribute.lineHeight, attribute.fontSize || textTheme.fontSize)) && void 0 !== _a ? _a : (attribute.fontSize || textTheme.fontSize) + buf;
+          lineHeight = this.getLineHeight(attribute, textTheme, 0);
         let {
           textAlign = textTheme.textAlign,
           textBaseline = textTheme.textBaseline
         } = attribute;
         if (!verticalMode) {
           const t = textAlign;
-          textAlign = null !== (_b = Text.baselineMapAlign[textBaseline]) && void 0 !== _b ? _b : "left", textBaseline = null !== (_c = Text.alignMapBaseline[t]) && void 0 !== _c ? _c : "top";
+          textAlign = null !== (_a = Text.baselineMapAlign[textBaseline]) && void 0 !== _a ? _a : "left", textBaseline = null !== (_b = Text.alignMapBaseline[t]) && void 0 !== _b ? _b : "top";
         }
         if (width = 0, !this.shouldUpdateShape() && this.cache) {
           this.cache.verticalList.forEach(item => {
@@ -7372,6 +7290,15 @@
           dy = textLayoutOffsetY(textBaseline, height, fontSize);
         return this._AABBBounds.set(dy, dx, dy + height, dx + width), stroke && this._AABBBounds.expand(lineWidth / 2), this._AABBBounds;
       }
+      getMaxWidth(theme) {
+        var _a, _b;
+        const attribute = this.attribute;
+        return null !== (_b = null !== (_a = attribute.maxLineWidth) && void 0 !== _a ? _a : attribute.maxWidth) && void 0 !== _b ? _b : theme.maxWidth;
+      }
+      getLineHeight(attribute, textTheme, buf) {
+        var _a;
+        return null !== (_a = calculateLineHeight(attribute.lineHeight, attribute.fontSize || textTheme.fontSize)) && void 0 !== _a ? _a : (attribute.fontSize || textTheme.fontSize) + buf;
+      }
       needUpdateTags(keys) {
         let k = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : TEXT_UPDATE_TAG_KEY;
         return super.needUpdateTags(keys, k);
@@ -7386,6 +7313,12 @@
       getNoWorkAnimateAttr() {
         return Text.NOWORK_ANIMATE_ATTR;
       }
+      getBaselineMapAlign() {
+        return Text.baselineMapAlign;
+      }
+      getAlignMapBaseline() {
+        return Text.alignMapBaseline;
+      }
     }
     Text.NOWORK_ANIMATE_ATTR = Object.assign({
       ellipsis: 1,