@visactor/vchart 1.11.11 → 1.11.12

package/build/index.js

@@ -17531,20 +17531,21 @@
         this.frame.lines.push(line), this.frame.actualHeight += line.height, this.y += line.height, this.lineBuffer.length = 0, this.lineWidth = this.maxAscent = this.maxDescent = this.maxAscentForBlank = this.maxDescentForBlank = 0;
       }
       deal(paragraph) {
-        paragraph instanceof RichTextIcon ? "horizontal" === this.direction && 0 === this.width || "vertical" === this.direction && 0 === this.height || this.lineWidth + paragraph[this.directionKey.width] <= this[this.directionKey.width] ? this.store(paragraph) : 0 === this.lineBuffer.length ? (this.store(paragraph), this.send()) : (this.send(), this.deal(paragraph)) : "number" != typeof this.width || this.width < 0 || (paragraph.newLine && this.send(), 0 !== paragraph.text.length && ("horizontal" === this.direction && 0 === this.width || "vertical" === this.direction && 0 === this.height || this.lineWidth + paragraph[this.directionKey.width] <= this[this.directionKey.width] ? this.store(paragraph) : this.lineWidth === this[this.directionKey.width] ? (this.send(), this.deal(paragraph)) : this.cut(paragraph)));
+        let singleLine = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !1;
+        paragraph instanceof RichTextIcon ? "horizontal" === this.direction && 0 === this.width || "vertical" === this.direction && 0 === this.height || this.lineWidth + paragraph[this.directionKey.width] <= this[this.directionKey.width] ? this.store(paragraph) : 0 === this.lineBuffer.length ? (this.store(paragraph), this.send()) : (this.send(), this.deal(paragraph)) : "number" != typeof this.width || this.width < 0 || (paragraph.newLine && this.send(), 0 !== paragraph.text.length && ("horizontal" === this.direction && 0 === this.width || "vertical" === this.direction && 0 === this.height || this.lineWidth + paragraph[this.directionKey.width] <= this[this.directionKey.width] ? this.store(paragraph) : this.lineWidth === this[this.directionKey.width] ? (this.send(), this.deal(paragraph)) : this.cut(paragraph, singleLine)));
       }
-      cut(paragraph) {
+      cut(paragraph, singleLine) {
         const availableWidth = this[this.directionKey.width] - this.lineWidth || 0,
           guessIndex = Math.ceil(availableWidth / paragraph[this.directionKey.width] * paragraph.length) || 0,
           index = getStrByWithCanvas(paragraph.text, availableWidth, paragraph.character, guessIndex, "break-word" === this.frame.wordBreak);
         if (0 !== index) {
           const [p1, p2] = seperateParagraph(paragraph, index);
-          this.store(p1), this.deal(p2);
+          this.store(p1), singleLine ? this.send() : this.deal(p2);
         } else 0 !== this.lineBuffer.length && (this.send(), this.deal(paragraph));
       }
     }
 
-    const RICHTEXT_UPDATE_TAG_KEY = ["width", "height", "ellipsis", "wordBreak", "verticalDirection", "maxHeight", "maxWidth", "textAlign", "textBaseline", "textConfig", "layoutDirection", ...GRAPHIC_UPDATE_TAG_KEY];
+    const RICHTEXT_UPDATE_TAG_KEY = ["width", "height", "ellipsis", "wordBreak", "verticalDirection", "maxHeight", "maxWidth", "textAlign", "textBaseline", "textConfig", "layoutDirection", "fill", "stroke", "fontSize", ...GRAPHIC_UPDATE_TAG_KEY];
     class RichText extends Graphic {
       constructor(params) {
         super(params), this.type = "richtext", this._currentHoverIcon = null, this.numberType = RICHTEXT_NUMBER_TYPE;
@@ -17716,7 +17717,7 @@
             skip = !1;
           for (let i = 0; i < paragraphs.length; i++) {
             const p = paragraphs[i];
-            skip ? (p.overflow = !0, p.left = 1 / 0, p.top = 1 / 0, !p.newLine && frame.lines[frame.lines.length - 1].paragraphs.push(p)) : wrapper.deal(p), frame.lines.length !== lineCount && (lineCount = frame.lines.length, wrapper.lineBuffer.length = 0, p.overflow = !0, p.left = 1e3, p.top = 1e3, frame.lines[frame.lines.length - 1].paragraphs.push(p), skip = !0), p.newLine && (skip = !1, wrapper.lineWidth = 0);
+            skip ? (p.overflow = !0, p.left = 1 / 0, p.top = 1 / 0, !p.newLine && frame.lines[frame.lines.length - 1].paragraphs.push(p)) : wrapper.deal(p, !0), frame.lines.length !== lineCount && (lineCount = frame.lines.length, wrapper.lineBuffer.length = 0, p.overflow = !0, p.left = 1e3, p.top = 1e3, frame.lines[frame.lines.length - 1].paragraphs.push(p), skip = !0), p.newLine && (skip = !1, wrapper.lineWidth = 0), wrapper.send();
           }
         } else for (let i = 0; i < paragraphs.length; i++) wrapper.deal(paragraphs[i]);
         wrapper.send();
@@ -17757,10 +17758,11 @@
         let pickIcon;
         return frameCache.icons.forEach(icon => {
           var _a, _b;
-          icon.AABBBounds.containsPoint({
+          const bounds = icon.AABBBounds.clone();
+          bounds.translate(icon._marginArray[3], icon._marginArray[0]), bounds.containsPoint({
             x: point.x - x,
             y: point.y - y
-          }) && (pickIcon = icon, pickIcon.globalX = (null !== (_a = pickIcon.attribute.x) && void 0 !== _a ? _a : 0) + x, pickIcon.globalY = (null !== (_b = pickIcon.attribute.y) && void 0 !== _b ? _b : 0) + y);
+          }) && (pickIcon = icon, pickIcon.globalX = (null !== (_a = pickIcon.attribute.x) && void 0 !== _a ? _a : 0) + x + icon._marginArray[3], pickIcon.globalY = (null !== (_b = pickIcon.attribute.y) && void 0 !== _b ? _b : 0) + y + icon._marginArray[0]);
         }), pickIcon;
       }
       getNoWorkAnimateAttr() {
@@ -19864,7 +19866,7 @@
     const defaultGroupBackgroundRenderContribution = new DefaultGroupBackgroundRenderContribution();
 
     const halfPi = pi$1 / 2;
-    function createRectPath(path, x, y, width, height, rectCornerRadius) {
+    function createRectPath(path, x, y, width, height, rectCornerRadius, edgeCb) {
       let cornerRadius;
       if (width < 0 && (x += width, width = -width), height < 0 && (y += height, height = -height), isNumber$1(rectCornerRadius, !0)) cornerRadius = [rectCornerRadius = abs$1(rectCornerRadius), rectCornerRadius, rectCornerRadius, rectCornerRadius];else if (Array.isArray(rectCornerRadius)) {
         const cornerRadiusArr = rectCornerRadius;
@@ -19896,27 +19898,28 @@
         rightBottomPoint2 = [rightBottom[0], rightBottom[1] - _cornerRadius[2]],
         leftBottomPoint1 = [leftBottom[0] + _cornerRadius[3], leftBottom[1]],
         leftBottomPoint2 = [leftBottom[0], leftBottom[1] - _cornerRadius[3]];
-      if (path.moveTo(leftTopPoint1[0], leftTopPoint1[1]), path.lineTo(rightTopPoint1[0], rightTopPoint1[1]), !arrayEqual(rightTopPoint1, rightTopPoint2)) {
+      if (path.moveTo(leftTopPoint1[0], leftTopPoint1[1]), edgeCb && edgeCb[0] ? edgeCb[0](leftTopPoint1[0], leftTopPoint1[1], rightTopPoint1[0], rightTopPoint1[1]) : path.lineTo(rightTopPoint1[0], rightTopPoint1[1]), !arrayEqual(rightTopPoint1, rightTopPoint2)) {
+        edgeCb && edgeCb[0] && path.moveTo(rightTopPoint1[0], rightTopPoint1[1]);
         const centerX = rightTopPoint1[0],
           centerY = rightTopPoint1[1] + _cornerRadius[1];
         path.arc(centerX, centerY, _cornerRadius[1], -halfPi, 0, !1);
       }
-      if (path.lineTo(rightBottomPoint2[0], rightBottomPoint2[1]), !arrayEqual(rightBottomPoint1, rightBottomPoint2)) {
+      if (edgeCb && edgeCb[1] ? edgeCb[1](rightTopPoint2[0], rightTopPoint2[1], rightBottomPoint2[0], rightBottomPoint2[1]) : path.lineTo(rightBottomPoint2[0], rightBottomPoint2[1]), !arrayEqual(rightBottomPoint1, rightBottomPoint2)) {
         const centerX = rightBottomPoint2[0] - _cornerRadius[2],
           centerY = rightBottomPoint2[1];
-        path.arc(centerX, centerY, _cornerRadius[2], 0, halfPi, !1);
+        edgeCb && edgeCb[1] && path.moveTo(rightBottomPoint2[0], rightBottomPoint2[1]), path.arc(centerX, centerY, _cornerRadius[2], 0, halfPi, !1);
       }
-      if (path.lineTo(leftBottomPoint1[0], leftBottomPoint1[1]), !arrayEqual(leftBottomPoint1, leftBottomPoint2)) {
+      if (edgeCb && edgeCb[2] ? edgeCb[2](rightBottomPoint1[0], rightBottomPoint1[1], leftBottomPoint1[0], leftBottomPoint1[1]) : path.lineTo(leftBottomPoint1[0], leftBottomPoint1[1]), !arrayEqual(leftBottomPoint1, leftBottomPoint2)) {
         const centerX = leftBottomPoint1[0],
           centerY = leftBottomPoint1[1] - _cornerRadius[3];
-        path.arc(centerX, centerY, _cornerRadius[3], halfPi, pi$1, !1);
+        edgeCb && edgeCb[2] && path.moveTo(leftBottomPoint1[0], leftBottomPoint1[1]), path.arc(centerX, centerY, _cornerRadius[3], halfPi, pi$1, !1);
       }
-      if (path.lineTo(leftTopPoint2[0], leftTopPoint2[1]), !arrayEqual(leftTopPoint1, leftTopPoint2)) {
+      if (edgeCb && edgeCb[3] ? edgeCb[3](leftBottomPoint2[0], leftBottomPoint2[1], leftTopPoint2[0], leftTopPoint2[1]) : path.lineTo(leftTopPoint2[0], leftTopPoint2[1]), !arrayEqual(leftTopPoint1, leftTopPoint2)) {
         const centerX = leftTopPoint1[0],
           centerY = leftTopPoint1[1] + _cornerRadius[0];
-        path.arc(centerX, centerY, _cornerRadius[0], pi$1, pi$1 + halfPi, !1);
+        edgeCb && edgeCb[3] && path.moveTo(leftTopPoint2[0], leftTopPoint2[1]), path.arc(centerX, centerY, _cornerRadius[0], pi$1, pi$1 + halfPi, !1);
       }
-      return path.closePath(), path;
+      return !edgeCb && path.closePath(), path;
     }
 
     var __decorate$1w = undefined && undefined.__decorate || function (decorators, target, key, desc) {
@@ -20005,14 +20008,24 @@
           y1: y1,
           x: originX = groupAttribute.x,
           y: originY = groupAttribute.y,
-          stroke = groupAttribute.stroke
+          stroke = groupAttribute.stroke,
+          cornerRadius = groupAttribute.cornerRadius
         } = rect.attribute;
         let {
           width: width,
           height: height
         } = rect.attribute;
         if (width = (null != width ? width : x1 - originX) || 0, height = (null != height ? height : y1 - originY) || 0, Array.isArray(stroke) && stroke.some(s => !1 === s)) {
-          if (context.setStrokeStyle(rect, rect.attribute, x, y, groupAttribute), context.beginPath(), context.moveTo(x, y), stroke[0] ? context.lineTo(x + width, y) : context.moveTo(x + width, y), stroke[1] ? context.lineTo(x + width, y + height) : context.moveTo(x + width, y + height), stroke[2] ? context.lineTo(x, y + height) : context.moveTo(x, y + height), stroke[3]) {
+          if (context.setStrokeStyle(rect, rect.attribute, x, y, groupAttribute), !(0 === cornerRadius || isArray$1(cornerRadius) && cornerRadius.every(num => 0 === num))) {
+            let lastStroke,
+              lastStrokeI = 0;
+            return createRectPath(context, x, y, width, height, cornerRadius, new Array(4).fill(0).map((_, i) => (x1, y1, x2, y2) => {
+              stroke[i] && (lastStrokeI === i - 1 && stroke[i] === lastStroke || (context.setStrokeStyle(rect, Object.assign(Object.assign({}, rect.attribute), {
+                stroke: stroke[i]
+              }), x, y, groupAttribute), context.beginPath(), context.moveTo(x1, y1), lastStroke = stroke[i]), lastStrokeI = i, context.lineTo(x2, y2), context.stroke(), 3 === i && context.beginPath());
+            })), void context.stroke();
+          }
+          if (context.beginPath(), context.moveTo(x, y), stroke[0] ? context.lineTo(x + width, y) : context.moveTo(x + width, y), stroke[1] ? context.lineTo(x + width, y + height) : context.moveTo(x + width, y + height), stroke[2] ? context.lineTo(x, y + height) : context.moveTo(x, y + height), stroke[3]) {
             const adjustY = stroke[0] ? y - context.lineWidth / 2 : y;
             context.lineTo(x, adjustY);
           } else context.moveTo(x, y);
@@ -20921,9 +20934,9 @@
           data = this.valid(area, areaAttribute, fillCb, strokeCb);
         if (!data) return;
         const {
-            doFill: doFill,
-            doStroke: doStroke
+            doFill: doFill
           } = data,
+          doStroke = data.doStroke && data.sVisible,
           {
             clipRange = areaAttribute.clipRange,
             closePath: closePath,
@@ -21740,7 +21753,9 @@
           clip: clip,
           baseOpacity = 1
         } = group.attribute;
-        clip ? context.save() : context.highPerformanceSave(), context.baseGlobalAlpha *= baseOpacity;
+        clip ? context.save() : context.highPerformanceSave();
+        const baseGlobalAlpha = context.baseGlobalAlpha;
+        context.baseGlobalAlpha *= baseOpacity;
         const groupAttribute = getTheme$1(group, null == params ? void 0 : params.theme).group,
           lastModelMatrix = context.modelMatrix;
         if (context.camera) {
@@ -21754,7 +21769,7 @@
           scrollY = groupAttribute.scrollY
         } = group.attribute;
         let p;
-        (scrollX || scrollY) && context.translate(scrollX, scrollY), params && params.drawingCb && (p = params.drawingCb()), context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix, context.baseGlobalAlpha /= baseOpacity, p && p.then ? p.then(() => {
+        (scrollX || scrollY) && context.translate(scrollX, scrollY), params && params.drawingCb && (p = params.drawingCb()), context.modelMatrix !== lastModelMatrix && mat4Allocate.free(context.modelMatrix), context.modelMatrix = lastModelMatrix, context.baseGlobalAlpha = baseGlobalAlpha, p && p.then ? p.then(() => {
           clip ? context.restore() : context.highPerformanceRestore();
         }) : clip ? context.restore() : context.highPerformanceRestore();
       }
@@ -21887,7 +21902,7 @@
           const m = graphic.globalTransMatrix.getInverse();
           drawContribution.dirtyBounds.copy(drawContribution.backupDirtyBounds).transformWithMatrix(m), drawContribution.backupDirtyBounds.copy(drawContribution.dirtyBounds);
         }
-        return drawContribution.renderGroup(graphic.shadowRoot, drawContext, graphic.parent.globalTransMatrix), context.highPerformanceRestore(), drawContribution.dirtyBounds && drawContribution.backupDirtyBounds && (drawContribution.dirtyBounds.copy(tempDirtyBounds), drawContribution.backupDirtyBounds.copy(tempBackupDirtyBounds)), !0;
+        return drawContribution.renderGroup(graphic.shadowRoot, drawContext, matrixAllocate.allocate(1, 0, 0, 1, 0, 0)), context.highPerformanceRestore(), drawContribution.dirtyBounds && drawContribution.backupDirtyBounds && (drawContribution.dirtyBounds.copy(tempDirtyBounds), drawContribution.backupDirtyBounds.copy(tempBackupDirtyBounds)), !0;
       }
     }
     class DebugDrawItemInterceptorContribution {
@@ -25564,7 +25579,7 @@
         return isMiniAppLikeMode(mode) || mode === 'mobile-browser';
     }
     function isMiniAppLikeMode(mode) {
-        return mode.includes('miniApp') || mode === 'lynx' || mode === 'wx';
+        return mode.includes('miniApp') || mode === 'lynx' || mode === 'wx' || mode === 'harmony';
     }
 
     let VChartId = 0;
@@ -26486,7 +26501,7 @@
           opacity = defaultParams.opacity,
           fill = defaultParams.fill
         } = attribute;
-        fillOpacity > 1e-12 && opacity > 1e-12 ? (_context.globalAlpha = fillOpacity * opacity * this.baseGlobalAlpha, _context.fillStyle = createColor(this, fill, params, offsetX, offsetY)) : _context.globalAlpha = fillOpacity * opacity * this.baseGlobalAlpha;
+        _context.globalAlpha = fillOpacity * opacity * this.baseGlobalAlpha, fillOpacity > 1e-12 && opacity > 1e-12 && (_context.fillStyle = createColor(this, fill, params, offsetX, offsetY));
       }
       setShadowBlendStyle(params, attribute, defaultParams) {
         if (Array.isArray(defaultParams)) {
@@ -26529,7 +26544,7 @@
           strokeOpacity = defaultParams.strokeOpacity,
           opacity = defaultParams.opacity
         } = attribute;
-        if (strokeOpacity > 1e-12 && opacity > 1e-12) {
+        if (_context.globalAlpha = strokeOpacity * opacity * this.baseGlobalAlpha, strokeOpacity > 1e-12 && opacity > 1e-12) {
           const {
             lineWidth = defaultParams.lineWidth,
             stroke = defaultParams.stroke,
@@ -26538,7 +26553,7 @@
             lineCap = defaultParams.lineCap,
             miterLimit = defaultParams.miterLimit
           } = attribute;
-          _context.globalAlpha = strokeOpacity * opacity * this.baseGlobalAlpha, _context.lineWidth = getScaledStroke(this, lineWidth, this.dpr), _context.strokeStyle = createColor(this, stroke, params, offsetX, offsetY), _context.lineJoin = lineJoin, lineDash && _context.setLineDash(lineDash), _context.lineCap = lineCap, _context.miterLimit = miterLimit;
+          _context.lineWidth = getScaledStroke(this, lineWidth, this.dpr), _context.strokeStyle = createColor(this, stroke, params, offsetX, offsetY), _context.lineJoin = lineJoin, lineDash && _context.setLineDash(lineDash), _context.lineCap = lineCap, _context.miterLimit = miterLimit;
         }
       }
       setTextStyleWithoutAlignBaseline(params, defaultParams, z) {
@@ -34531,6 +34546,21 @@
         labelPoint = getVerticalCoord(point, getCircleVerticalVector(labelOffset, point, center, inside));
       return getCircleLabelPosition(labelPoint, getCircleVerticalVector(labelOffset || 1, labelPoint, center, inside), text, style);
     }
+    function getCirclePoints(center, count, radius, startAngle, endAngle) {
+      const points = [],
+        range = endAngle - startAngle;
+      for (let i = 0; i < count; i++) {
+        const angle = startAngle + i * range / count;
+        points.push(polarToCartesian$1(center, radius, angle));
+      }
+      return points;
+    }
+    function getPolygonPath(points, closed) {
+      let path = "";
+      return 0 === points.length || (points.forEach((point, index) => {
+        0 === index ? path = `M${point.x},${point.y}` : path += `L${point.x},${point.y}`;
+      }), closed && (path += "Z")), path;
+    }
 
     const dispatchHoverState = (e, container, lastHover) => {
       const target = e.target;
@@ -35552,19 +35582,27 @@
           center: center,
           innerRadius = 0,
           line = {},
-          inside = !1
+          inside = !1,
+          sides: sides
         } = this.attribute;
-        let arcRadius = radius,
+        let lineGraphic,
+          arcRadius = radius,
           arcInnerRadius = innerRadius;
-        inside && innerRadius > 0 && (arcRadius = innerRadius, arcInnerRadius = 0);
-        const arcAttrs = Object.assign(Object.assign(Object.assign({}, center), {
+        if (inside && innerRadius > 0 && (arcRadius = innerRadius, arcInnerRadius = 0), isValidNumber$1(sides) && sides >= 3) {
+          const gridPoints = getCirclePoints(center, sides, arcRadius, startAngle, endAngle);
+          lineGraphic = graphicCreator.path(Object.assign(Object.assign({}, line.style), {
+            path: getPolygonPath(gridPoints, !0)
+          }));
+        } else {
+          const arcAttrs = Object.assign(Object.assign(Object.assign({}, center), {
             startAngle: startAngle,
             endAngle: endAngle,
             radius: arcRadius,
             innerRadius: arcInnerRadius
-          }), line.style),
-          axisLine = graphicCreator.circle(arcAttrs);
-        axisLine.name = AXIS_ELEMENT_NAME.line, axisLine.id = this._getNodeId("line"), isEmpty(line.state) || (axisLine.states = merge$2({}, DEFAULT_STATES$1, line.state)), container.add(axisLine);
+          }), line.style);
+          lineGraphic = graphicCreator.circle(arcAttrs);
+        }
+        lineGraphic.name = AXIS_ELEMENT_NAME.line, lineGraphic.id = this._getNodeId("line"), isEmpty(line.state) || (lineGraphic.states = merge$2({}, DEFAULT_STATES$1, line.state)), container.add(lineGraphic);
       }
       getTitleAttribute() {
         var _a, _b, _c;
@@ -35718,7 +35756,7 @@
       onStart() {
         let duration = this.duration,
           easing = this.easing;
-        Object.keys(this._newElementAttrMap).forEach(id => {
+        this._newElementAttrMap && Object.keys(this._newElementAttrMap).forEach(id => {
           var _a;
           const {
             node: node,
@@ -37120,12 +37158,6 @@
       return convertDomainToTickData(scale.domain());
     };
 
-    function getLinePath(points, closed) {
-      let path = "";
-      return 0 === points.length || (points.forEach((point, index) => {
-        0 === index ? path = `M${point.x},${point.y}` : path += `L${point.x},${point.y}`;
-      }), closed && (path += "Z")), path;
-    }
     function getArcPath(center, points, reverse, closed) {
       let path = "";
       if (!center || 0 === points.length) return path;
@@ -37148,7 +37180,7 @@
         const fromStart = from[0],
           toEnd = reversePoints[0],
           center = attribute.center;
-        regionPath = getLinePath(from, !!closed), nextPath = getLinePath(reversePoints, !!closed);
+        regionPath = getPolygonPath(from, !!closed), nextPath = getPolygonPath(reversePoints, !!closed);
         const toEndRadius = PointService.distancePP(toEnd, center),
           fromStartRadius = PointService.distancePP(fromStart, center);
         regionPath += `A${toEndRadius},${toEndRadius},0,0,1,${toEnd.x},${toEnd.y}L${toEnd.x},${toEnd.y}`, nextPath += `A${fromStartRadius},${fromStartRadius},0,0,0,${fromStart.x},${fromStart.y}`;
@@ -37157,7 +37189,7 @@
           center: center
         } = attribute;
         regionPath = getArcPath(center, from, !1, !!closed), nextPath = getArcPath(center, reversePoints, !0, !!closed);
-      } else "line" !== type && "polygon" !== type || (regionPath = getLinePath(from, !!closed), nextPath = getLinePath(reversePoints, !!closed));
+      } else "line" !== type && "polygon" !== type || (regionPath = getPolygonPath(from, !!closed), nextPath = getPolygonPath(reversePoints, !!closed));
       return closed ? regionPath += nextPath : (nextPath = "L" + nextPath.substring(1), regionPath += nextPath, regionPath += "Z"), regionPath;
     }
     class BaseGrid extends AbstractComponent {
@@ -37218,7 +37250,7 @@
             points: points
           } = item;
           let path = "";
-          if ("line" === type || "polygon" === type) path = getLinePath(points, !!closed);else if ("circle" === type) {
+          if ("line" === type || "polygon" === type) path = getPolygonPath(points, !!closed);else if ("circle" === type) {
             const {
               center: center
             } = this.attribute;
@@ -37244,7 +37276,7 @@
             x: points[0].x + dir_x * ratio,
             y: points[0].y + dir_y * ratio
           });
-          const path = getLinePath(nextPoints, !!closed),
+          const path = getPolygonPath(nextPoints, !!closed),
             deltaX = abs$1(nextPoints[0].x - nextPoints[1].x),
             deltaY = abs$1(nextPoints[0].y - nextPoints[1].y),
             shape = graphicCreator.path(Object.assign({
@@ -37294,15 +37326,6 @@
       }
     };
 
-    function getCirclePoints(center, count, radius, startAngle, endAngle) {
-      const points = [],
-        range = endAngle - startAngle;
-      for (let i = 0; i < count; i++) {
-        const angle = startAngle + i * range / count;
-        points.push(polarToCartesian$1(center, radius, angle));
-      }
-      return points;
-    }
     loadLineAxisGridComponent();
     class LineAxisGrid extends BaseGrid {
       constructor(attributes, options) {
@@ -37317,12 +37340,13 @@
           gridPoints = [point, this.getVerticalCoord(point, length, !0)];
         } else if ("circle" === gridType || "polygon" === gridType) {
           const {
-            center: center,
-            sides = 6,
-            startAngle = POLAR_START_ANGLE$1,
-            endAngle = POLAR_END_ANGLE$1
-          } = this.attribute;
-          gridPoints = getCirclePoints(center, sides, PointService.distancePP(center, point), startAngle, endAngle);
+              center: center,
+              sides = 6,
+              startAngle = POLAR_START_ANGLE$1,
+              endAngle = POLAR_END_ANGLE$1
+            } = this.attribute,
+            distance = PointService.distancePP(center, point);
+          gridPoints = getCirclePoints(center, sides, distance, startAngle, endAngle);
         }
         return gridPoints;
       }
@@ -40709,12 +40733,13 @@
       _createPager(compStyle) {
         var _a, _b;
         const {
-          disableTriggerEvent: disableTriggerEvent,
-          maxRow: maxRow
-        } = this.attribute;
+            disableTriggerEvent: disableTriggerEvent,
+            maxRow: maxRow
+          } = this.attribute,
+          estimateTotal = num => num <= 99 ? 99 : num <= 999 ? 999 : 9999;
         return this._itemContext.isHorizontal ? new Pager(Object.assign(Object.assign({
           layout: 1 === maxRow ? "horizontal" : "vertical",
-          total: 99
+          total: estimateTotal(this._itemContext.pages)
         }, merge$2({
           handler: {
             preShape: "triangleUp",
@@ -40725,7 +40750,7 @@
           disableTriggerEvent: disableTriggerEvent
         })) : new Pager(Object.assign({
           layout: "horizontal",
-          total: 99,
+          total: estimateTotal(this._itemContext.pages),
           disableTriggerEvent: disableTriggerEvent,
           defaultCurrent: null === (_b = this.attribute.pager) || void 0 === _b ? void 0 : _b.defaultCurrent
         }, compStyle));
@@ -55877,10 +55902,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         if (!chart) {
             return null;
         }
-        const series = getFirstSeries(chart.getRegionsInIndex(), 'polar');
-        if (!series) {
-            return null;
-        }
         const { x, y } = pos;
         const angleAxisList = getAxis(chart, (cmp) => cmp.getOrient() === 'angle', pos);
         const radiusAxisList = getAxis(chart, (cmp) => cmp.getOrient() === 'radius', pos);
@@ -56025,10 +56046,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         if (!chart) {
             return null;
         }
-        const series = getFirstSeries(chart.getRegionsInIndex(), 'cartesian');
-        if (!series) {
-            return null;
-        }
         const { x, y } = pos;
         const xAxisList = (_a = getAxis(chart, (cmp) => isXAxis(cmp.getOrient()), pos)) !== null && _a !== void 0 ? _a : [];
         const yAxisList = (_b = getAxis(chart, (cmp) => isYAxis(cmp.getOrient()), pos)) !== null && _b !== void 0 ? _b : [];
@@ -57556,7 +57573,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             reRender: merge('reRender'),
             reSize: merge('reSize'),
             reTransformSpec: merge('reTransformSpec'),
-            changeTheme: merge('changeTheme')
+            changeTheme: merge('changeTheme'),
+            changeBackground: merge('changeBackground')
         });
         return target;
     }
@@ -59684,9 +59702,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             const regionWidth = Math.max(Math.min(regionRelativeTotalWidth, ...regionItems.map(region => { var _a; return (_a = region.maxWidth) !== null && _a !== void 0 ? _a : Number.MAX_VALUE; })), 0);
             const regionHeight = Math.max(Math.min(regionRelativeTotalHeight, ...regionItems.map(region => { var _a; return (_a = region.maxHeight) !== null && _a !== void 0 ? _a : Number.MAX_VALUE; })), 0);
             regionItems.forEach(region => {
+                const width = regionWidth - region.layoutPaddingLeft - region.layoutPaddingRight;
+                const height = regionHeight - region.layoutPaddingTop - region.layoutPaddingBottom;
                 region.setLayoutRect({
-                    width: regionWidth,
-                    height: regionHeight
+                    width: width,
+                    height: height
                 });
                 region.setLayoutStartPosition({
                     x: this.leftCurrent + region.layoutOffsetX + region.layoutPaddingLeft,
@@ -61610,7 +61630,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this._beforeRender(option);
         }
         _reCompile(updateResult, morphConfig) {
-            var _a, _b, _c, _d, _e, _f, _g, _h;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
             if (updateResult.reMake) {
                 this._releaseData();
                 this._initDataSet();
@@ -61621,7 +61641,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     this._setCurrentTheme();
                     this._setFontFamilyTheme((_b = this._currentTheme) === null || _b === void 0 ? void 0 : _b.fontFamily);
                 }
-                (_c = this._compiler) === null || _c === void 0 ? void 0 : _c.releaseGrammar(((_d = this._option) === null || _d === void 0 ? void 0 : _d.animation) === false || ((_e = this._spec) === null || _e === void 0 ? void 0 : _e.animation) === false);
+                else if (updateResult.changeBackground) {
+                    (_c = this._compiler) === null || _c === void 0 ? void 0 : _c.setBackground(this._getBackground());
+                }
+                (_d = this._compiler) === null || _d === void 0 ? void 0 : _d.releaseGrammar(((_e = this._option) === null || _e === void 0 ? void 0 : _e.animation) === false || ((_f = this._spec) === null || _f === void 0 ? void 0 : _f.animation) === false);
                 this._userEvents.forEach(e => { var _a; return (_a = this._event) === null || _a === void 0 ? void 0 : _a.on(e.eType, e.query, e.handler); });
                 if (updateResult.reSize) {
                     this._doResize();
@@ -61630,11 +61653,14 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             else {
                 if (updateResult.changeTheme) {
                     this._setCurrentTheme();
-                    this._setFontFamilyTheme((_f = this._currentTheme) === null || _f === void 0 ? void 0 : _f.fontFamily);
+                    this._setFontFamilyTheme((_g = this._currentTheme) === null || _g === void 0 ? void 0 : _g.fontFamily);
+                }
+                else if (updateResult.changeBackground) {
+                    (_h = this._compiler) === null || _h === void 0 ? void 0 : _h.setBackground(this._getBackground());
                 }
                 if (updateResult.reCompile) {
-                    (_g = this._compiler) === null || _g === void 0 ? void 0 : _g.clear({ chart: this._chart, vChart: this }, !this._option.animation || !this._spec.animation);
-                    (_h = this._compiler) === null || _h === void 0 ? void 0 : _h.compile({ chart: this._chart, vChart: this }, {});
+                    (_j = this._compiler) === null || _j === void 0 ? void 0 : _j.clear({ chart: this._chart, vChart: this }, !this._option.animation || !this._spec.animation);
+                    (_k = this._compiler) === null || _k === void 0 ? void 0 : _k.compile({ chart: this._chart, vChart: this }, {});
                 }
                 if (updateResult.reSize) {
                     const { width, height } = this.getCurrentSize();
@@ -61905,6 +61931,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             if (!isEqual$1(lastSpec.theme, this._spec.theme)) {
                 result.changeTheme = true;
             }
+            else if (!isEqual$1(this._spec.background, lastSpec.background)) {
+                result.reMake = true;
+                result.changeBackground = true;
+            }
             const reSize = this._shouldChartResize(lastSpec);
             result.reSize = reSize;
             (_b = (_a = this._compiler) === null || _a === void 0 ? void 0 : _a.getVGrammarView()) === null || _b === void 0 ? void 0 : _b.updateLayoutTag();
@@ -66824,7 +66854,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         registerComponentPlugin(CanvasTooltipHandler);
     };
 
-    const version = "1.11.11";
+    const version = "1.11.12";
 
     const addVChartProperty = (data, op) => {
         const context = op.beforeCall();
@@ -70750,7 +70780,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     rangeSize = isX ? this._option.getChartViewRect().width : this._option.getChartViewRect().height;
                 }
                 tickCount = tick.tickCount({
-                    rangeSize,
+                    axisLength: rangeSize,
                     labelStyle: this._spec.label && this._spec.label.style
                 });
             }
@@ -72540,9 +72570,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             var _a, _b;
             this._paddingSpec = normalizeLayoutPaddingSpec((_a = this._spec.padding) !== null && _a !== void 0 ? _a : (_b = this._option) === null || _b === void 0 ? void 0 : _b.getTheme().padding);
             this._updateLayoutRect(this._viewBox);
-            if (!isEqual$1(this._spec.background, oldSpec.background)) {
-                result.reMake = true;
-            }
         }
         updateDataSpec() {
             if (!this._spec.data) {
@@ -78386,7 +78413,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         if (!data || data.length === 0) {
             return data;
         }
-        const { angleField, startAngle, endAngle, minAngle, asStartAngle, asEndAngle, asMiddleAngle, asRadian, asRatio, asQuadrant, asK } = op;
+        const { asStartAngle, asEndAngle, asMiddleAngle, asRadian, asRatio, asQuadrant, asK } = op;
+        const angleField = op.angleField();
+        const startAngle = op.startAngle();
+        const endAngle = op.endAngle();
+        const minAngle = op.minAngle();
         const appendArcInfo = (data, startAngle, angle) => {
             data[asStartAngle] = startAngle;
             data[asEndAngle] = startAngle + angle;
@@ -78679,12 +78710,57 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
     }
 
+    const getPolarAxisInfo = (spec, chartSpec) => {
+        var _a, _b, _c, _d, _e, _f;
+        const axisType = (_a = spec.type) !== null && _a !== void 0 ? _a : (spec.orient === 'angle' ? 'band' : 'linear');
+        const componentName = `${ComponentTypeEnum.polarAxis}-${axisType}`;
+        const startAngleFromSpec = (_b = spec.startAngle) !== null && _b !== void 0 ? _b : chartSpec.startAngle;
+        const endAngleFromSpec = (_c = spec.endAngle) !== null && _c !== void 0 ? _c : chartSpec.endAngle;
+        return {
+            axisType,
+            componentName,
+            startAngle: startAngleFromSpec !== null && startAngleFromSpec !== void 0 ? startAngleFromSpec : POLAR_START_ANGLE,
+            endAngle: endAngleFromSpec !== null && endAngleFromSpec !== void 0 ? endAngleFromSpec : (isValid$1(startAngleFromSpec) ? startAngleFromSpec + 360 : POLAR_END_ANGLE),
+            center: isValid$1(chartSpec.center)
+                ? chartSpec.center
+                : isValid$1(chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerX) || isValid$1(chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerY)
+                    ? {
+                        x: chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerX,
+                        y: chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerY
+                    }
+                    : undefined,
+            outerRadius: (_f = (_e = (_d = spec.radius) !== null && _d !== void 0 ? _d : chartSpec.outerRadius) !== null && _e !== void 0 ? _e : chartSpec.radius) !== null && _f !== void 0 ? _f : POLAR_DEFAULT_RADIUS,
+            layoutRadius: chartSpec.layoutRadius
+        };
+    };
+    const computeLayoutRadius = (layoutRadius, getLayoutRect, getCenter, startAngle = 0, endAngle = 0 * Math.PI) => {
+        if (isNumber$1(layoutRadius)) {
+            return layoutRadius;
+        }
+        else if (isFunction$1(layoutRadius)) {
+            return layoutRadius(getLayoutRect(), getCenter());
+        }
+        const rect = getLayoutRect();
+        if (layoutRadius === 'auto' && rect.width > 0 && rect.height > 0) {
+            return calculateMaxRadius(rect, getCenter(), startAngle, endAngle);
+        }
+        return Math.min(rect.width / 2, rect.height / 2);
+    };
+
     class BasePieSeries extends PolarSeries {
         constructor() {
             super(...arguments);
             this.transformerConstructor = PieSeriesSpecTransformer;
             this._pieMarkName = "pie";
             this._pieMarkType = "arc";
+            this.getCenter = () => {
+                var _a, _b, _c, _d;
+                const { width, height } = this._region.getLayoutRect();
+                return {
+                    x: (_b = (_a = this._spec) === null || _a === void 0 ? void 0 : _a.centerX) !== null && _b !== void 0 ? _b : width / 2,
+                    y: (_d = (_c = this._spec) === null || _c === void 0 ? void 0 : _c.centerY) !== null && _d !== void 0 ? _d : height / 2
+                };
+            };
             this._startAngle = POLAR_START_RADIAN;
             this._endAngle = POLAR_END_RADIAN;
             this._pieMark = null;
@@ -78701,14 +78777,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 return polarToCartesian$1(center, (radius + innerRadius) / 2, angle);
             };
         }
-        getCenter() {
-            var _a, _b, _c, _d;
-            const { width, height } = this._region.getLayoutRect();
-            return {
-                x: (_b = (_a = this._spec) === null || _a === void 0 ? void 0 : _a.centerX) !== null && _b !== void 0 ? _b : width / 2,
-                y: (_d = (_c = this._spec) === null || _c === void 0 ? void 0 : _c.centerY) !== null && _d !== void 0 ? _d : height / 2
-            };
-        }
         _buildMarkAttributeContext() {
             super._buildMarkAttributeContext();
             this._markAttributeContext.getCenter = () => ({
@@ -78745,10 +78813,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             viewData.transform({
                 type: 'pie',
                 options: {
-                    angleField: this._angleField[0],
-                    startAngle: this._startAngle,
-                    endAngle: this._endAngle,
-                    minAngle: isValid$1(this._spec.minAngle) ? degreeToRadian(this._spec.minAngle) : 0,
+                    angleField: () => this._angleField[0],
+                    startAngle: () => this._startAngle,
+                    endAngle: () => this._endAngle,
+                    minAngle: () => (isValid$1(this._spec.minAngle) ? degreeToRadian(this._spec.minAngle) : 0),
                     asStartAngle: ARC_START_ANGLE,
                     asEndAngle: ARC_END_ANGLE,
                     asRatio: ARC_RATIO,
@@ -78783,6 +78851,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         endAngleScale(datum) {
             return field$2(ARC_END_ANGLE)(datum);
         }
+        _computeLayoutRadius() {
+            return computeLayoutRadius(this._spec.layoutRadius, this.getLayoutRect, this.getCenter, this._startAngle, this._endAngle);
+        }
         initMarkStyle() {
             const pieMark = this._pieMark;
             if (pieMark) {
@@ -78899,28 +78970,23 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         _compareSpec(spec, prevSpec, ignoreCheckKeys) {
             ignoreCheckKeys = ignoreCheckKeys !== null && ignoreCheckKeys !== void 0 ? ignoreCheckKeys : { data: true };
-            ignoreCheckKeys.centerX = true;
-            ignoreCheckKeys.centerX = true;
-            ignoreCheckKeys.centerY = true;
-            ignoreCheckKeys.centerOffset = true;
-            ignoreCheckKeys.radius = true;
-            ignoreCheckKeys.innerRadius = true;
-            ignoreCheckKeys.cornerRadius = true;
-            ignoreCheckKeys.startAngle = true;
-            ignoreCheckKeys.endAngle = true;
-            ignoreCheckKeys.padAngle = true;
-            const { centerX, centerY, centerOffset, radius, innerRadius, cornerRadius, startAngle, endAngle, padAngle } = prevSpec;
+            const defaultIgnoreKeys = [
+                'centerX',
+                'centerY',
+                'centerOffset',
+                'radius',
+                'innerRadius',
+                'cornerRadius',
+                'startAngle',
+                'endAngle',
+                'padAngle'
+            ];
+            defaultIgnoreKeys.forEach(key => {
+                ignoreCheckKeys[key] = true;
+            });
             const result = super._compareSpec(spec, prevSpec, ignoreCheckKeys);
             spec = spec !== null && spec !== void 0 ? spec : {};
-            if (spec.centerY !== centerY ||
-                spec.centerX !== centerX ||
-                spec.centerOffset !== centerOffset ||
-                spec.radius !== radius ||
-                spec.innerRadius !== innerRadius ||
-                spec.cornerRadius !== cornerRadius ||
-                spec.startAngle !== startAngle ||
-                spec.endAngle !== endAngle ||
-                spec.padAngle !== padAngle) {
+            if (defaultIgnoreKeys.some(key => spec[key] !== prevSpec[key])) {
                 result.reRender = true;
                 result.change = true;
             }
@@ -79194,30 +79260,6 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
     }
 
-    const getPolarAxisInfo = (spec, chartSpec) => {
-        var _a, _b, _c, _d, _e, _f;
-        const axisType = (_a = spec.type) !== null && _a !== void 0 ? _a : (spec.orient === 'angle' ? 'band' : 'linear');
-        const componentName = `${ComponentTypeEnum.polarAxis}-${axisType}`;
-        const startAngleFromSpec = (_b = spec.startAngle) !== null && _b !== void 0 ? _b : chartSpec.startAngle;
-        const endAngleFromSpec = (_c = spec.endAngle) !== null && _c !== void 0 ? _c : chartSpec.endAngle;
-        return {
-            axisType,
-            componentName,
-            startAngle: startAngleFromSpec !== null && startAngleFromSpec !== void 0 ? startAngleFromSpec : POLAR_START_ANGLE,
-            endAngle: endAngleFromSpec !== null && endAngleFromSpec !== void 0 ? endAngleFromSpec : (isValid$1(startAngleFromSpec) ? startAngleFromSpec + 360 : POLAR_END_ANGLE),
-            center: isValid$1(chartSpec.center)
-                ? chartSpec.center
-                : isValid$1(chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerX) || isValid$1(chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerY)
-                    ? {
-                        x: chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerX,
-                        y: chartSpec === null || chartSpec === void 0 ? void 0 : chartSpec.centerY
-                    }
-                    : undefined,
-            outerRadius: (_f = (_e = (_d = spec.radius) !== null && _d !== void 0 ? _d : chartSpec.outerRadius) !== null && _e !== void 0 ? _e : chartSpec.radius) !== null && _f !== void 0 ? _f : POLAR_DEFAULT_RADIUS,
-            layoutRadius: chartSpec.layoutRadius
-        };
-    };
-
     class PolarAxis extends AxisComponent {
         get center() {
             return this._center;
@@ -79261,7 +79303,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
             const specInfos = [];
             let angleAxisIndex;
+            let radiusAxisIndex;
             const radiusAxisSpecInfos = [];
+            const angleAxisSpecInfos = [];
             axesSpec.forEach((s, i) => {
                 if (!isValidPolarAxis(s)) {
                     return;
@@ -79282,14 +79326,19 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 specInfos.push(info);
                 if (s.orient === 'radius') {
                     radiusAxisSpecInfos.push(info);
+                    radiusAxisIndex = i;
                 }
                 else {
+                    angleAxisSpecInfos.push(info);
                     angleAxisIndex = i;
                 }
             });
             radiusAxisSpecInfos.forEach(info => {
                 info.angleAxisIndex = angleAxisIndex;
             });
+            angleAxisSpecInfos.forEach(info => {
+                info.radiusAxisIndex = radiusAxisIndex;
+            });
             return specInfos;
         }
         static createComponent(specInfo, options) {
@@ -79337,6 +79386,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 const region = (_a = this.getRegions()) === null || _a === void 0 ? void 0 : _a[0];
                 return region ? region.getLayoutStartPoint() : pos;
             };
+            this.getRefLayoutRect = () => {
+                return this.getRegions()[0].getLayoutRect();
+            };
             this._coordinateType = 'polar';
         }
         setAttrFromSpec() {
@@ -79433,7 +79485,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 coordToPoint: this.coordToPoint.bind(this),
                 pointToCoord: this.pointToCoord.bind(this),
                 center: this.getCenter.bind(this),
-                layoutRadius: this.computeLayoutRadius.bind(this),
+                layoutRadius: this._computeLayoutRadius.bind(this),
                 getScale,
                 getAxisId: () => this.id,
                 getSpec: () => this._spec
@@ -79524,6 +79576,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this._startAngle;
         }
         _layoutAngleAxis() {
+            var _a, _b, _c;
             const center = this.getCenter();
             const radius = this.computeLayoutOuterRadius();
             const innerRadius = this.computeLayoutInnerRadius();
@@ -79531,7 +79584,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             const items = this.getLabelItems(angleRange);
             const commonAttrs = Object.assign(Object.assign({}, this.getLayoutStartPoint()), { inside: this._spec.inside, center,
                 radius,
-                innerRadius, startAngle: this._startAngle, endAngle: this._endAngle });
+                innerRadius, startAngle: this._startAngle, endAngle: this._endAngle, sides: ((_c = (_b = (_a = this._getRelatedAxis(this._option.radiusAxisIndex)) === null || _a === void 0 ? void 0 : _a.getSpec()) === null || _b === void 0 ? void 0 : _b.grid) === null || _c === void 0 ? void 0 : _c.smooth)
+                    ? undefined
+                    : this.getScale().domain().length });
             const attrs = Object.assign(Object.assign({}, commonAttrs), { title: {
                     text: this._spec.title.text || this._dataFieldText
                 }, items, orient: 'angle' });
@@ -79554,44 +79609,29 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     text: this._spec.title.text || this._dataFieldText
                 }, items, orient: 'radius' });
             if ((_a = this._spec.grid) === null || _a === void 0 ? void 0 : _a.visible) {
-                attrs.grid = Object.assign({ items: items[0], type: ((_b = this._spec.grid) === null || _b === void 0 ? void 0 : _b.smooth) ? 'circle' : 'polygon', center, closed: true, sides: (_c = this._getRelatedAngleAxis()) === null || _c === void 0 ? void 0 : _c.getScale().domain().length, startAngle: this._startAngle, endAngle: this._endAngle }, commonAttrs);
+                attrs.grid = Object.assign({ items: items[0], type: ((_b = this._spec.grid) === null || _b === void 0 ? void 0 : _b.smooth) ? 'circle' : 'polygon', center, closed: true, sides: (_c = this._getRelatedAxis(this._option.angleAxisIndex)) === null || _c === void 0 ? void 0 : _c.getScale().domain().length, startAngle: this._startAngle, endAngle: this._endAngle }, commonAttrs);
             }
             this._update(attrs);
         }
-        _getRelatedAngleAxis() {
-            const index = this._option.angleAxisIndex;
+        _getRelatedAxis(index) {
             if (isValid$1(index)) {
                 return this._option.getComponentByIndex(this.specKey, index);
             }
             return undefined;
         }
-        computeLayoutRadius() {
-            const layoutRect = this.getRefLayoutRect();
-            if (isNumber$1(this._spec.layoutRadius)) {
-                return this._spec.layoutRadius;
-            }
-            else if (isFunction$1(this._spec.layoutRadius)) {
-                return this._spec.layoutRadius(layoutRect, this.getCenter());
-            }
-            const { width, height } = layoutRect;
-            if (this._spec.layoutRadius === 'auto' && width > 0 && height > 0) {
-                return calculateMaxRadius(layoutRect, this.getCenter(), this._startAngle, this._endAngle);
-            }
-            return Math.min(width / 2, height / 2);
+        _computeLayoutRadius() {
+            return computeLayoutRadius(this._spec.layoutRadius, this.getRefLayoutRect, this.getCenter, this._startAngle, this._endAngle);
         }
         computeLayoutOuterRadius() {
             var _a;
             const radius = (_a = this._spec.outerRadius) !== null && _a !== void 0 ? _a : this._spec.radius;
             const outerRadius = radius !== null && radius !== void 0 ? radius : this.getRefSeriesRadius().outerRadius;
-            return this.computeLayoutRadius() * outerRadius;
+            return this._computeLayoutRadius() * outerRadius;
         }
         computeLayoutInnerRadius() {
             var _a;
             const innerRadius = (_a = this._spec.innerRadius) !== null && _a !== void 0 ? _a : this.getRefSeriesRadius().innerRadius;
-            return this.computeLayoutRadius() * innerRadius;
-        }
-        getRefLayoutRect() {
-            return this.getRegions()[0].getLayoutRect();
+            return this._computeLayoutRadius() * innerRadius;
         }
         getRefSeriesRadius() {
             let outerRadius = POLAR_DEFAULT_RADIUS;
@@ -84232,7 +84272,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             else {
                 this._funnelAlign = ['left', 'right'].includes(this._spec.funnelAlign) ? this._spec.funnelAlign : 'center';
             }
-            if (this._spec.categoryField) {
+            if (!this._seriesField && this._spec.categoryField) {
                 this.setSeriesField(this._spec.categoryField);
             }
         }
@@ -89121,12 +89161,12 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         _getAngleValueStartWithoutMask(datum) {
             const startAngle = this._getAngleValueStartWithoutPadAngle(datum);
             const endAngle = this._getAngleValueEndWithoutPadAngle(datum);
-            return Math.min(startAngle + this._padAngle / 2, (startAngle + endAngle) / 2);
+            return clamper(startAngle, (startAngle + endAngle) / 2)(startAngle + (endAngle > startAngle ? 1 : -1) * Math.abs(this._padAngle / 2));
         }
         _getAngleValueEndWithoutMask(datum) {
             const startAngle = this._getAngleValueStartWithoutPadAngle(datum);
             const endAngle = this._getAngleValueEndWithoutPadAngle(datum);
-            return Math.max(endAngle - this._padAngle / 2, (startAngle + endAngle) / 2);
+            return clamper(endAngle, (startAngle + endAngle) / 2)(endAngle - (endAngle > startAngle ? 1 : -1) * Math.abs(this._padAngle / 2));
         }
         _getAngleValueStartWithoutPadAngle(datum) {
             return isValid$1(datum[SEGMENT_FIELD_START])
@@ -91485,7 +91525,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return false;
         }
         _getDefaultSeriesSpec(spec) {
-            return Object.assign(Object.assign({}, super._getDefaultSeriesSpec(spec)), { categoryField: spec.categoryField || spec.seriesField, valueField: spec.valueField || spec.angleField, center: spec.center, centerOffset: spec.centerOffset, cornerRadius: spec.cornerRadius, padAngle: spec.padAngle, minAngle: spec.minAngle });
+            return Object.assign(Object.assign({}, super._getDefaultSeriesSpec(spec)), { categoryField: spec.categoryField || spec.seriesField, valueField: spec.valueField || spec.angleField, center: spec.center, centerOffset: spec.centerOffset, cornerRadius: spec.cornerRadius, padAngle: spec.padAngle, minAngle: spec.minAngle, layoutRadius: spec.layoutRadius });
         }
     }
 
@@ -93113,6 +93153,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         getBoundsInRect(rect, fullSpace) {
             if (!this._visible) {
+                if (this._legendComponent && this._legendComponent.parent) {
+                    this._legendComponent.parent.removeChild(this._legendComponent);
+                    this._legendComponent = null;
+                }
                 return { x1: 0, y1: 0, x2: 0, y2: 0 };
             }
             const result = { x1: this.getLayoutStartPoint().x, y1: this.getLayoutStartPoint().y, x2: 0, y2: 0 };
@@ -100345,9 +100389,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return data;
         }
         _extendDatumOutOfBrush(elementsMap) {
+            var _a;
             const data = [];
             for (const elementKey in elementsMap) {
-                data.push(elementsMap[elementKey].data[0]);
+                data.push((_a = elementsMap[elementKey].data) === null || _a === void 0 ? void 0 : _a[0]);
             }
             return data;
         }