@visactor/vchart 1.11.3-alpha.0 → 1.11.4

package/build/index.js

@@ -13241,6 +13241,12 @@
       return Array.isArray(color) && isNumber$1(color[0]) ? alphaChannel ? `rgb(${Math.round(color[0])},${Math.round(color[1])},${Math.round(color[2])},${color[3].toFixed(2)})` : `rgb(${Math.round(color[0])},${Math.round(color[1])},${Math.round(color[2])})` : color;
     }
     function interpolateColor(from, to, ratio, alphaChannel, cb) {
+      if (Array.isArray(from) && !isNumber$1(from[0]) || Array.isArray(to) && !isNumber$1(to[0])) {
+        return new Array(4).fill(0).map((_, index) => _interpolateColor(isArray$1(from) ? from[index] : from, isArray$1(to) ? to[index] : to, ratio, alphaChannel));
+      }
+      return _interpolateColor(from, to, ratio, alphaChannel, cb);
+    }
+    function _interpolateColor(from, to, ratio, alphaChannel, cb) {
       if (!from || !to) return from && colorArrayToString(from) || to && colorArrayToString(to) || !1;
       let fromArray,
         toArray,
@@ -14040,7 +14046,7 @@
           animate.stateNames = stateNames, animate.to(animateAttrs, null !== (_b = null === (_a = this.stateAnimateConfig) || void 0 === _a ? void 0 : _a.duration) && void 0 !== _b ? _b : DefaultStateAnimateConfig.duration, null !== (_d = null === (_c = this.stateAnimateConfig) || void 0 === _c ? void 0 : _c.easing) && void 0 !== _d ? _d : DefaultStateAnimateConfig.easing), noAnimateAttrs && this.setAttributes(noAnimateAttrs, !1, {
             type: AttributeUpdateType.STATE
           });
-        } else this.setAttributes(attrs, !1, {
+        } else this.stopStateAnimates(), this.setAttributes(attrs, !1, {
           type: AttributeUpdateType.STATE
         });
       }
@@ -14070,7 +14076,7 @@
         }), value;
       }
       clearStates(hasAnimation) {
-        this.stopStateAnimates(), this.hasState() && this.normalAttrs ? (this.currentStates = [], this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0)) : this.currentStates = [], this.normalAttrs = null;
+        this.hasState() && this.normalAttrs ? (this.currentStates = [], this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0)) : this.currentStates = [], this.normalAttrs = null;
       }
       removeState(stateName, hasAnimation) {
         if ((this.currentStates ? this.currentStates.indexOf(stateName) : -1) >= 0) {
@@ -14096,7 +14102,6 @@
         var _a;
         if (!states.length) return void this.clearStates(hasAnimation);
         if (!((null === (_a = this.currentStates) || void 0 === _a ? void 0 : _a.length) !== states.length || states.some((stateName, index) => this.currentStates[index] !== stateName))) return;
-        this.stopStateAnimates();
         const stateAttrs = {};
         states.forEach(stateName => {
           var _a;
@@ -16858,6 +16863,7 @@
         var _a;
         if (!states.length) return void this.clearStates(hasAnimation);
         if (!((null === (_a = this.currentStates) || void 0 === _a ? void 0 : _a.length) !== states.length || states.some((stateName, index) => this.currentStates[index] !== stateName))) return;
+        this.stopStateAnimates();
         const stateAttrs = {},
           subAttrs = this.subGraphic.map(() => ({}));
         states.forEach(stateName => {
@@ -16871,9 +16877,9 @@
         }), this.updateNormalAttrs(stateAttrs), this.currentStates = states, this.applyStateAttrs(stateAttrs, states, hasAnimation);
       }
       clearStates(hasAnimation) {
-        this.hasState() && this.normalAttrs && (this.subGraphic.forEach(graphic => {
+        this.stopStateAnimates(), this.hasState() && this.normalAttrs ? (this.currentStates = [], this.subGraphic.forEach(graphic => {
           graphic.applyStateAttrs(graphic.normalAttrs, this.currentStates, hasAnimation, !0), graphic.normalAttrs = null;
-        }), this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0), this.normalAttrs = null, this.currentStates = []);
+        }), this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0)) : this.currentStates = [], this.normalAttrs = null;
       }
       clone() {
         const glyph = new Glyph(Object.assign({}, this.attribute));
@@ -18388,7 +18394,7 @@
           onClearIncremental: new SyncHook(["graphic", "group", "stage"]),
           beforeUpdateAABBBounds: new SyncHook(["graphic", "stage", "willUpdate", "aabbBounds"]),
           afterUpdateAABBBounds: new SyncHook(["graphic", "stage", "aabbBounds", "globalAABBBounds", "selfChange"])
-        }, this.tempAABBBounds1 = new AABBBounds(), this.tempAABBBounds2 = new AABBBounds(), this._rectBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._symbolBoundsContribitions = [new DefaultSymbolOuterBorderBoundsContribution()], this._circleBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._arcBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._pathBoundsContribitions = [new DefaultOuterBorderBoundsContribution()];
+        }, this.tempAABBBounds1 = new AABBBounds(), this.tempAABBBounds2 = new AABBBounds(), this._rectBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._symbolBoundsContribitions = [new DefaultSymbolOuterBorderBoundsContribution()], this._imageBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._circleBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._arcBoundsContribitions = [new DefaultOuterBorderBoundsContribution()], this._pathBoundsContribitions = [new DefaultOuterBorderBoundsContribution()];
       }
       onAttributeUpdate(graphic) {
         this.hooks.onAttributeUpdate.taps.length && this.hooks.onAttributeUpdate.call(graphic);
@@ -18789,7 +18795,9 @@
         }
         const tb1 = this.tempAABBBounds1,
           tb2 = this.tempAABBBounds2;
-        return tb1.setValue(aabbBounds.x1, aabbBounds.y1, aabbBounds.x2, aabbBounds.y2), tb2.setValue(aabbBounds.x1, aabbBounds.y1, aabbBounds.x2, aabbBounds.y2), this.transformAABBBounds(attribute, aabbBounds, imageTheme, !1, graphic), aabbBounds;
+        return tb1.setValue(aabbBounds.x1, aabbBounds.y1, aabbBounds.x2, aabbBounds.y2), tb2.setValue(aabbBounds.x1, aabbBounds.y1, aabbBounds.x2, aabbBounds.y2), this._imageBoundsContribitions.length && this._imageBoundsContribitions.forEach(c => {
+          c.updateBounds(attribute, imageTheme, tb1, graphic), aabbBounds.union(tb1), tb1.setValue(tb2.x1, tb2.y1, tb2.x2, tb2.y2);
+        }), this.transformAABBBounds(attribute, aabbBounds, imageTheme, !1, graphic), aabbBounds;
       }
       combindShadowAABBBounds(bounds, graphic) {
         if (graphic && graphic.shadowRoot) {
@@ -19720,70 +19728,6 @@
       return path.closePath(), path;
     }
 
-    class DefaultImageBackgroundRenderContribution extends DefaultBaseBackgroundRenderContribution {
-      constructor() {
-        super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
-      }
-      drawShape(graphic, context, x, y, doFill, doStroke, fVisible, sVisible, graphicAttribute, drawContext, fillCb, strokeCb) {
-        const {
-          background: background,
-          backgroundMode = graphicAttribute.backgroundMode,
-          backgroundFit = graphicAttribute.backgroundFit
-        } = graphic.attribute;
-        if (background) if (graphic.backgroundImg) {
-          const res = graphic.resources.get(background);
-          if ("success" !== res.state || !res.data) return;
-          if (context.save(), graphic.parent && !graphic.transMatrix.onlyTranslate()) {
-            const groupAttribute = getTheme$1(graphic.parent).group,
-              {
-                scrollX = groupAttribute.scrollX,
-                scrollY = groupAttribute.scrollY
-              } = graphic.parent.attribute;
-            context.setTransformFromMatrix(graphic.parent.globalTransMatrix, !0), context.translate(scrollX, scrollY);
-          }
-          const b = graphic.AABBBounds;
-          this.doDrawImage(context, res.data, b, backgroundMode, backgroundFit), context.restore(), graphic.transMatrix.onlyTranslate() || context.setTransformForCurrent();
-        } else if (isObject$2(background)) {
-          const {
-            stroke: stroke,
-            fill: fill,
-            lineWidth = 1,
-            cornerRadius = 0,
-            expandX = 0,
-            expandY = 0
-          } = background;
-          if (!stroke && !fill) return;
-          context.beginPath();
-          const {
-            x: x,
-            y: y,
-            width: width,
-            height: height
-          } = getActualPosition(graphic);
-          cornerRadius ? createRectPath(context, x - expandX, y - expandY, width + 2 * expandX, height + 2 * expandY, cornerRadius) : context.rect(x - expandX, y - expandY, width + 2 * expandX, height + 2 * expandY), context.globalAlpha = 1, fill && (context.fillStyle = fill, context.fill()), stroke && lineWidth > 0 && (context.lineWidth = lineWidth, context.strokeStyle = stroke, context.stroke());
-        } else {
-          context.beginPath();
-          const b = graphic.AABBBounds;
-          context.rect(x, y, b.width(), b.height()), context.fillStyle = background, context.globalAlpha = 1, context.fill();
-        }
-      }
-    }
-    function getActualPosition(graphic) {
-      const boundsPadding = parsePadding(graphic.attribute.boundsPadding),
-        bounds = graphic.AABBBounds;
-      let x = bounds.x1,
-        y = bounds.y1,
-        width = bounds.width(),
-        height = bounds.height();
-      return isNumber$1(boundsPadding) ? (x += boundsPadding, y += boundsPadding, width -= 2 * boundsPadding, height -= 2 * boundsPadding) : (x += boundsPadding[3], y += boundsPadding[0], width -= boundsPadding[1] + boundsPadding[3], height -= boundsPadding[0] + boundsPadding[2]), {
-        x: x,
-        y: y,
-        width: width,
-        height: height
-      };
-    }
-    const defaultImageBackgroundRenderContribution = new DefaultImageBackgroundRenderContribution();
-
     var __decorate$1w = undefined && undefined.__decorate || function (decorators, target, key, desc) {
       var d,
         c = arguments.length,
@@ -19890,6 +19834,79 @@
     const defaultRectTextureRenderContribution = defaultBaseTextureRenderContribution;
     const defaultRectBackgroundRenderContribution = defaultBaseBackgroundRenderContribution;
 
+    class DefaultImageBackgroundRenderContribution extends DefaultBaseBackgroundRenderContribution {
+      constructor() {
+        super(...arguments), this.time = BaseRenderContributionTime.beforeFillStroke;
+      }
+      drawShape(graphic, context, x, y, doFill, doStroke, fVisible, sVisible, graphicAttribute, drawContext, fillCb, strokeCb) {
+        const {
+          background: background,
+          backgroundMode = graphicAttribute.backgroundMode,
+          backgroundFit = graphicAttribute.backgroundFit
+        } = graphic.attribute;
+        if (background) if (graphic.backgroundImg) {
+          const res = graphic.resources.get(background);
+          if ("success" !== res.state || !res.data) return;
+          if (context.save(), graphic.parent && !graphic.transMatrix.onlyTranslate()) {
+            const groupAttribute = getTheme$1(graphic.parent).group,
+              {
+                scrollX = groupAttribute.scrollX,
+                scrollY = groupAttribute.scrollY
+              } = graphic.parent.attribute;
+            context.setTransformFromMatrix(graphic.parent.globalTransMatrix, !0), context.translate(scrollX, scrollY);
+          }
+          const b = graphic.AABBBounds;
+          this.doDrawImage(context, res.data, b, backgroundMode, backgroundFit), context.restore(), graphic.transMatrix.onlyTranslate() || context.setTransformForCurrent();
+        } else if (isObject$2(background)) {
+          const {
+            stroke: stroke,
+            fill: fill,
+            lineWidth = 1,
+            cornerRadius = 0,
+            expandX = 0,
+            expandY = 0
+          } = background;
+          if (!stroke && !fill) return;
+          context.beginPath();
+          const {
+            x: x,
+            y: y,
+            width: width,
+            height: height
+          } = getActualPosition(graphic);
+          cornerRadius ? createRectPath(context, x - expandX, y - expandY, width + 2 * expandX, height + 2 * expandY, cornerRadius) : context.rect(x - expandX, y - expandY, width + 2 * expandX, height + 2 * expandY), context.globalAlpha = 1, fill && (context.fillStyle = fill, context.fill()), stroke && lineWidth > 0 && (context.lineWidth = lineWidth, context.strokeStyle = stroke, context.stroke());
+        } else {
+          context.beginPath();
+          const b = graphic.AABBBounds;
+          context.rect(x, y, b.width(), b.height()), context.fillStyle = background, context.globalAlpha = 1, context.fill();
+        }
+      }
+    }
+    function getActualPosition(graphic) {
+      const boundsPadding = parsePadding(graphic.attribute.boundsPadding),
+        bounds = graphic.AABBBounds;
+      let x = bounds.x1,
+        y = bounds.y1,
+        width = bounds.width(),
+        height = bounds.height();
+      return isNumber$1(boundsPadding) ? (x += boundsPadding, y += boundsPadding, width -= 2 * boundsPadding, height -= 2 * boundsPadding) : (x += boundsPadding[3], y += boundsPadding[0], width -= boundsPadding[1] + boundsPadding[3], height -= boundsPadding[0] + boundsPadding[2]), {
+        x: x,
+        y: y,
+        width: width,
+        height: height
+      };
+    }
+    class DefaultImageRenderContribution extends DefaultRectRenderContribution {
+      constructor() {
+        super(...arguments), this.time = BaseRenderContributionTime.afterFillStroke, this.useStyle = !0, this.order = 0;
+      }
+      drawShape(rect, context, x, y, doFill, doStroke, fVisible, sVisible, rectAttribute, drawContext, fillCb, strokeCb) {
+        return super.drawShape(rect, context, x, y, doFill, doStroke, fVisible, sVisible, rectAttribute, drawContext, fillCb, strokeCb);
+      }
+    }
+    const defaultImageRenderContribution = new DefaultImageRenderContribution();
+    const defaultImageBackgroundRenderContribution = new DefaultImageBackgroundRenderContribution();
+
     class DefaultSymbolRenderContribution {
       constructor() {
         this.time = BaseRenderContributionTime.afterFillStroke, this.useStyle = !0, this.order = 0;
@@ -21459,15 +21476,17 @@
     const repeatStr = ["", "repeat-x", "repeat-y", "repeat"];
     let DefaultCanvasImageRender = class extends BaseRender {
       constructor(imageRenderContribitions) {
-        super(), this.imageRenderContribitions = imageRenderContribitions, this.numberType = IMAGE_NUMBER_TYPE, this.builtinContributions = [defaultImageBackgroundRenderContribution], this.init(imageRenderContribitions);
+        super(), this.imageRenderContribitions = imageRenderContribitions, this.numberType = IMAGE_NUMBER_TYPE, this.builtinContributions = [defaultImageRenderContribution, defaultImageBackgroundRenderContribution], this.init(imageRenderContribitions);
       }
-      drawShape(image, context, x, y, drawContext, params, fillCb) {
+      drawShape(image, context, x, y, drawContext, params, fillCb, strokeCb) {
         const imageAttribute = getTheme$1(image).image,
           {
             width = imageAttribute.width,
             height = imageAttribute.height,
             repeatX = imageAttribute.repeatX,
             repeatY = imageAttribute.repeatY,
+            x: originX = imageAttribute.x,
+            y: originY = imageAttribute.y,
             cornerRadius = imageAttribute.cornerRadius,
             image: url
           } = image.attribute,
@@ -21492,7 +21511,7 @@
           } else context.drawImage(res.data, x, y, width, height);
           needRestore && context.restore();
         }
-        this.afterRenderStep(image, context, x, y, doFill, !1, fVisible, !1, imageAttribute, drawContext, fillCb);
+        doStroke && (strokeCb ? strokeCb(context, image.attribute, imageAttribute) : sVisible && (context.setStrokeStyle(image, image.attribute, originX - x, originY - y, imageAttribute), context.stroke())), this.afterRenderStep(image, context, x, y, doFill, !1, fVisible, !1, imageAttribute, drawContext, fillCb);
       }
       draw(image, renderService, drawContext) {
         const {
@@ -21543,7 +21562,8 @@
         if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(k, v);
       };
     const DrawItemInterceptor = Symbol.for("DrawItemInterceptor");
-    const tempDirtyBounds = new AABBBounds();
+    const tempDirtyBounds = new AABBBounds(),
+      tempBackupDirtyBounds = new AABBBounds();
     class ShadowRootDrawItemInterceptorContribution {
       constructor() {
         this.order = 1;
@@ -21560,11 +21580,11 @@
           context: context
         } = drawContext;
         if (context.highPerformanceSave(), context.transformFromMatrix(graphic.transMatrix, !0), drawContribution.dirtyBounds && drawContribution.backupDirtyBounds) {
-          tempDirtyBounds.copy(drawContribution.dirtyBounds);
+          tempDirtyBounds.copy(drawContribution.dirtyBounds), tempBackupDirtyBounds.copy(drawContribution.backupDirtyBounds);
           const m = graphic.globalTransMatrix.getInverse();
-          drawContribution.dirtyBounds.copy(drawContribution.backupDirtyBounds).transformWithMatrix(m);
+          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), !0;
+        return drawContribution.renderGroup(graphic.shadowRoot, drawContext, graphic.parent.globalTransMatrix), context.highPerformanceRestore(), drawContribution.dirtyBounds && drawContribution.backupDirtyBounds && (drawContribution.dirtyBounds.copy(tempDirtyBounds), drawContribution.backupDirtyBounds.copy(tempBackupDirtyBounds)), !0;
       }
     }
     class DebugDrawItemInterceptorContribution {
@@ -23524,7 +23544,9 @@
     let _isBrowserEnv;
     function initIsBrowserEnv() {
       if (null == _isBrowserEnv) try {
-        _isBrowserEnv = globalThis === window, _isBrowserEnv && (_isBrowserEnv = !!document.createElement);
+        const canvas = document.createElement("canvas"),
+          ctx = canvas.getContext("2d");
+        _isBrowserEnv = !!(window && canvas.getBoundingClientRect && requestAnimationFrame && window.devicePixelRatio && ctx && ctx.isPointInPath && ctx.isPointInStroke), _isBrowserEnv && (_isBrowserEnv = !!document.createElement);
       } catch (err) {
         _isBrowserEnv = !1;
       }
@@ -31227,6 +31249,9 @@
       const textType = getTextType(textAttributes, typeKey);
       return "rich" === textType ? graphicCreator.richtext(richTextAttributeTransform(textAttributes)) : ("html" === textType ? textAttributes = htmlAttributeTransform(textAttributes) : "react" === textType && (textAttributes = reactAttributeTransform(textAttributes)), graphicCreator.text(textAttributes));
     }
+    function alignTextInLine(layoutAlign, graphic, textAlign, pos, textWidth) {
+      "right" === layoutAlign ? "center" === textAlign ? graphic.setAttribute("x", pos - textWidth / 2) : "right" === textAlign || "end" === textAlign ? graphic.setAttribute("x", pos) : graphic.setAttribute("x", pos - textWidth) : "center" === textAlign ? graphic.setAttribute("x", pos + textWidth / 2) : "right" === textAlign || "end" === textAlign ? graphic.setAttribute("x", pos + textWidth) : graphic.setAttribute("x", pos);
+    }
 
     const deltaXYToAngle = (y, x) => {
       const angle = Math.atan2(y, x);
@@ -37404,11 +37429,11 @@
             start: start,
             end: end
           } = this.state;
-          this._activeState && (this._activeTag === DataZoomActiveTag.middleHandler ? this.moveZoomWithMiddle((this.state.start + this.state.end) / 2 + dis) : this._activeTag === DataZoomActiveTag.startHandler ? start + dis > end ? (start = end, end = start + dis, this._activeTag = DataZoomActiveTag.endHandler) : start += dis : this._activeTag === DataZoomActiveTag.endHandler && (end + dis < start ? (end = start, start = end + dis, this._activeTag = DataZoomActiveTag.startHandler) : end += dis), this._activeCache.lastPos = pos, brushSelect && this.renderDragMask()), start = Math.min(Math.max(start, 0), 1), end = Math.min(Math.max(end, 0), 1), startAttr === start && endAttr === end || this.setStateAttr(start, end, !0), realTime && this._dispatchEvent("change", {
+          this._activeState && (this._activeTag === DataZoomActiveTag.middleHandler ? this.moveZoomWithMiddle((this.state.start + this.state.end) / 2 + dis) : this._activeTag === DataZoomActiveTag.startHandler ? start + dis > end ? (start = end, end = start + dis, this._activeTag = DataZoomActiveTag.endHandler) : start += dis : this._activeTag === DataZoomActiveTag.endHandler && (end + dis < start ? (end = start, start = end + dis, this._activeTag = DataZoomActiveTag.startHandler) : end += dis), this._activeCache.lastPos = pos, brushSelect && this.renderDragMask()), start = Math.min(Math.max(start, 0), 1), end = Math.min(Math.max(end, 0), 1), startAttr === start && endAttr === end || (this.setStateAttr(start, end, !0), realTime && this._dispatchEvent("change", {
             start: start,
             end: end,
             tag: this._activeTag
-          });
+          }));
         }, this._onHandlerPointerMove = 0 === this.attribute.delayTime ? this._pointerMove : delayMap$2[this.attribute.delayType](this._pointerMove, this.attribute.delayTime), this._onHandlerPointerUp = e => {
           e.preventDefault();
           const {
@@ -37421,11 +37446,11 @@
             const pos = this.eventPosToStagePos(e);
             this.backgroundDragZoom(this._activeCache.startPos, pos);
           }
-          this._activeState = !1, brushSelect && this.renderDragMask(), start === this.state.start && end === this.state.end || this.setStateAttr(this.state.start, this.state.end, !0), this._dispatchEvent("change", {
+          this._activeState = !1, brushSelect && this.renderDragMask(), start === this.state.start && end === this.state.end || (this.setStateAttr(this.state.start, this.state.end, !0), this._dispatchEvent("change", {
             start: this.state.start,
             end: this.state.end,
             tag: this._activeTag
-          }), "browser" === vglobal.env && (vglobal.removeEventListener("pointermove", this._onHandlerPointerMove, {
+          })), "browser" === vglobal.env && (vglobal.removeEventListener("pointermove", this._onHandlerPointerMove, {
             capture: !0
           }), vglobal.removeEventListener("pointerup", this._onHandlerPointerUp)), this.removeEventListener("pointermove", this._onHandlerPointerMove, {
             capture: !0
@@ -41515,6 +41540,7 @@
         return inverse && (isHorizontal ? (res.x0 = 1, res.x1 = 0) : (res.y0 = 1, res.y1 = 0)), res;
       }
       _updateColor() {
+        var _a;
         const {
             layout = "horizontal",
             colors: colors,
@@ -41524,7 +41550,8 @@
           {
             startHandler: startHandler,
             endHandler: endHandler,
-            track: track
+            track: track,
+            attribute: attribute
           } = this._slider,
           {
             startValue: startValue,
@@ -41532,9 +41559,15 @@
             startPos: startPos,
             endPos: endPos
           } = this._slider.currentValue,
-          startHandlerColor = this._colorScale.scale(startValue),
-          endHandlerColor = this._colorScale.scale(endValue);
-        null == startHandler || startHandler.setAttribute("fill", startHandlerColor), null == endHandler || endHandler.setAttribute("fill", endHandlerColor);
+          handlerColor = null === (_a = attribute.handlerStyle) || void 0 === _a ? void 0 : _a.fill;
+        if (startHandler && !handlerColor) {
+          const startHandlerColor = this._colorScale.scale(startValue);
+          startHandler.setAttribute("fill", startHandlerColor);
+        }
+        if (endHandler && !handlerColor) {
+          const endHandlerColor = this._colorScale.scale(endValue);
+          endHandler.setAttribute("fill", endHandlerColor);
+        }
         const railLen = "horizontal" === layout ? railWidth : railHeight;
         if (Math.abs(startPos - endPos) !== railLen && colors && colors.length > 1) {
           const stops = this._color.stops,
@@ -41579,6 +41612,7 @@
       },
       handlerSize: 10,
       handlerStyle: {
+        fill: null,
         lineWidth: 4,
         stroke: "#fff",
         outerBorder: {
@@ -42671,6 +42705,7 @@
           this._outOfInteractiveRange(e) || ((this._activeDrawState || this._activeMoveState) && e.stopPropagation(), this._activeDrawState && this._drawing(e), this._activeMoveState && this._moving(e));
         }, this._onBrushingWithDelay = 0 === this.attribute.delayTime ? this._onBrushing : delayMap$1[this.attribute.delayType](this._onBrushing, this.attribute.delayTime), this._onBrushEnd = e => {
           var _a;
+          if (!this._activeDrawState && !this._activeMoveState) return;
           e.preventDefault();
           const {
             removeOnClick = !0
@@ -43018,7 +43053,8 @@
           valueWidth: valueWidth,
           hasContentShape: hasContentShape,
           autoCalculatePosition: autoCalculatePosition,
-          autoMeasure: autoMeasure
+          autoMeasure: autoMeasure,
+          align: align
         } = this.attribute;
         if (!visible) return void this.hideAll();
         autoMeasure && Tooltip.measureTooltip(this.attribute), autoCalculatePosition && Tooltip.calculateTooltipPosition(this.attribute);
@@ -43069,7 +43105,6 @@
           this._tooltipContent.setAttribute("x", padding[3]), this._tooltipContent.setAttribute("y", padding[0] + titleHeight);
           let lastYPos = 0;
           content.forEach((item, i) => {
-            var _a, _b, _c;
             const itemAttr = Tooltip.getContentAttr(this.attribute, i);
             if (!isVisible(itemAttr)) return;
             const itemGroupName = `tooltip-content-${i}`,
@@ -43077,68 +43112,81 @@
                 visible: !0,
                 x: 0,
                 y: lastYPos
-              }, "group");
-            let x = 0;
-            if (isVisible(itemAttr.shape) && itemGroup.createOrUpdateChild(`${itemGroupName}-shape`, Object.assign({
-              visible: !0,
-              x: itemAttr.shape.size / 2,
-              y: itemAttr.shape.size / 2 + ((null !== (_a = calculateLineHeight(itemAttr.key.lineHeight, itemAttr.key.fontSize)) && void 0 !== _a ? _a : itemAttr.key.fontSize) - itemAttr.shape.size) / 2
-            }, itemAttr.shape), "symbol"), hasContentShape && (x += itemAttr.shape.size + itemAttr.shape.spacing), isVisible(itemAttr.key)) {
-              let element;
-              element = itemAttr.key.multiLine ? itemGroup.createOrUpdateChild(`${itemGroupName}-key`, Object.assign(Object.assign({
-                visible: !0
-              }, getRichTextAttribute(itemAttr.key)), {
-                textBaseline: "top"
-              }), "richtext") : "object" != typeof itemAttr.key.text || null === itemAttr.key.text || "rich" !== itemAttr.key.text.type && "html" !== itemAttr.key.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-key`, Object.assign(Object.assign({
-                visible: !0,
-                text: null !== (_b = itemAttr.key.text) && void 0 !== _b ? _b : ""
-              }, itemAttr.key), {
-                textBaseline: "top"
-              }), "text") : "rich" === itemAttr.key.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
-                visible: !0
-              }, getRichTextAttribute(itemAttr.key)), {
-                textBaseline: "top"
-              }), "richtext") : itemGroup.createOrUpdateChild(`${itemGroupName}-value`, {
-                html: Object.assign(Object.assign({
-                  dom: itemAttr.key.text.text
-                }, DEFAULT_HTML_TEXT_SPEC), itemAttr.key)
-              }, "richtext");
-              const {
-                textAlign: textAlign
-              } = itemAttr.key;
-              "center" === textAlign ? element.setAttribute("x", x + keyWidth / 2) : "right" === textAlign || "end" === textAlign ? element.setAttribute("x", x + keyWidth) : element.setAttribute("x", x), element.setAttribute("y", 0), x += keyWidth + itemAttr.key.spacing;
-            }
-            if (isVisible(itemAttr.value)) {
-              let element;
-              element = itemAttr.value.multiLine ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
-                visible: !0
-              }, getRichTextAttribute(itemAttr.value)), {
-                textBaseline: "top"
-              }), "richtext") : "object" != typeof itemAttr.value.text || null === itemAttr.value.text || "rich" !== itemAttr.value.text.type && "html" !== itemAttr.value.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
-                visible: !0,
-                text: null !== (_c = itemAttr.value.text) && void 0 !== _c ? _c : ""
-              }, itemAttr.value), {
-                textBaseline: "top"
-              }), "text") : "rich" === itemAttr.value.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
-                visible: !0
-              }, getRichTextAttribute(itemAttr.value)), {
-                textBaseline: "top"
-              }), "richtext") : itemGroup.createOrUpdateChild(`${itemGroupName}-value`, {
-                html: Object.assign({
-                  dom: itemAttr.value.text.text,
-                  container: "",
-                  width: 30,
-                  height: 30,
-                  style: {}
-                }, itemAttr.value)
-              }, "richtext");
+              }, "group"),
+              shapeOffsetWidth = itemAttr.shape.size + itemAttr.shape.spacing;
+            let x = "right" === align ? (hasContentShape ? shapeOffsetWidth : 0) + (isVisible(itemAttr.key) ? keyWidth + itemAttr.key.spacing : 0) + (isVisible(itemAttr.value) ? valueWidth : 0) : 0;
+            this._createShape("right" === align ? x - itemAttr.shape.size / 2 : x + itemAttr.shape.size / 2, itemAttr, itemGroup, itemGroupName), hasContentShape && ("right" === align ? x -= shapeOffsetWidth : x += shapeOffsetWidth);
+            const keyGraphic = this._createKey(itemAttr, itemGroup, itemGroupName);
+            keyGraphic && (alignTextInLine(align, keyGraphic, itemAttr.key.textAlign, x, keyWidth), keyGraphic.setAttribute("y", 0), "right" === align ? x -= keyWidth + itemAttr.key.spacing : x += keyWidth + itemAttr.key.spacing);
+            const valueGraphic = this._createValue(itemAttr, itemGroup, itemGroupName);
+            if (valueGraphic) {
               let textAlign = "right";
-              isValid$1(itemAttr.value.textAlign) ? textAlign = itemAttr.value.textAlign : isVisible(itemAttr.key) || (textAlign = "left"), element.setAttribute("textAlign", textAlign), "center" === textAlign ? element.setAttribute("x", x + valueWidth / 2) : "right" === textAlign || "end" === textAlign ? element.setAttribute("x", x + valueWidth) : element.setAttribute("x", x), x += valueWidth, element.setAttribute("y", 0), itemGroup.add(element);
+              isValid$1(itemAttr.value.textAlign) ? textAlign = itemAttr.value.textAlign : isVisible(itemAttr.key) || "right" === align || (textAlign = "left"), valueGraphic.setAttribute("textAlign", textAlign), alignTextInLine(align, valueGraphic, textAlign, x, valueWidth), valueGraphic.setAttribute("y", 0);
             }
             lastYPos += itemAttr.height + itemAttr.spaceRow;
           });
         }
       }
+      _createShape(x, itemAttr, itemGroup, itemGroupName) {
+        var _a;
+        if (isVisible(itemAttr.shape)) return itemGroup.createOrUpdateChild(`${itemGroupName}-shape`, Object.assign({
+          visible: !0,
+          x: x,
+          y: itemAttr.shape.size / 2 + ((null !== (_a = calculateLineHeight(itemAttr.key.lineHeight, itemAttr.key.fontSize)) && void 0 !== _a ? _a : itemAttr.key.fontSize) - itemAttr.shape.size) / 2
+        }, itemAttr.shape), "symbol");
+      }
+      _createKey(itemAttr, itemGroup, itemGroupName) {
+        var _a;
+        if (isVisible(itemAttr.key)) {
+          let element;
+          return element = itemAttr.key.multiLine ? itemGroup.createOrUpdateChild(`${itemGroupName}-key`, Object.assign(Object.assign({
+            visible: !0
+          }, getRichTextAttribute(itemAttr.key)), {
+            textBaseline: "top"
+          }), "richtext") : "object" != typeof itemAttr.key.text || null === itemAttr.key.text || "rich" !== itemAttr.key.text.type && "html" !== itemAttr.key.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-key`, Object.assign(Object.assign({
+            visible: !0,
+            text: null !== (_a = itemAttr.key.text) && void 0 !== _a ? _a : ""
+          }, itemAttr.key), {
+            textBaseline: "top"
+          }), "text") : "rich" === itemAttr.key.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
+            visible: !0
+          }, getRichTextAttribute(itemAttr.key)), {
+            textBaseline: "top"
+          }), "richtext") : itemGroup.createOrUpdateChild(`${itemGroupName}-value`, {
+            html: Object.assign(Object.assign({
+              dom: itemAttr.key.text.text
+            }, DEFAULT_HTML_TEXT_SPEC), itemAttr.key)
+          }, "richtext"), element;
+        }
+      }
+      _createValue(itemAttr, itemGroup, itemGroupName) {
+        var _a;
+        if (isVisible(itemAttr.value)) {
+          let element;
+          return element = itemAttr.value.multiLine ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
+            visible: !0
+          }, getRichTextAttribute(itemAttr.value)), {
+            textBaseline: "top"
+          }), "richtext") : "object" != typeof itemAttr.value.text || null === itemAttr.value.text || "rich" !== itemAttr.value.text.type && "html" !== itemAttr.value.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
+            visible: !0,
+            text: null !== (_a = itemAttr.value.text) && void 0 !== _a ? _a : ""
+          }, itemAttr.value), {
+            textBaseline: "top"
+          }), "text") : "rich" === itemAttr.value.text.type ? itemGroup.createOrUpdateChild(`${itemGroupName}-value`, Object.assign(Object.assign({
+            visible: !0
+          }, getRichTextAttribute(itemAttr.value)), {
+            textBaseline: "top"
+          }), "richtext") : itemGroup.createOrUpdateChild(`${itemGroupName}-value`, {
+            html: Object.assign({
+              dom: itemAttr.value.text.text,
+              container: "",
+              width: 30,
+              height: 30,
+              style: {}
+            }, itemAttr.value)
+          }, "richtext"), element;
+        }
+      }
       setAttributes(params, forceUpdateTag) {
         const keys = Object.keys(params);
         this.attribute.autoCalculatePosition && keys.every(key => TOOLTIP_POSITION_ATTRIBUTES.includes(key)) ? (this._mergeAttributes(params, keys), isNil$1(this.attribute.panel.width) && this.attribute.autoMeasure && Tooltip.measureTooltip(this.attribute), Tooltip.calculateTooltipPosition(this.attribute), super.setAttributes({
@@ -44259,12 +44307,12 @@
     let Element$1 = class Element {
       constructor(mark) {
         this.data = null, this.states = [], this.diffState = DiffState.enter, this.isReserved = !1, this.runtimeStatesEncoder = null, this.items = [], this.getStateAttrs = (stateName, nextStates) => {
-          var _a, _b, _c;
+          var _a, _b, _c, _d;
           const isRuntimeState = !isNil$1(null === (_a = this.runtimeStatesEncoder) || void 0 === _a ? void 0 : _a[stateName]),
-            encoder = isRuntimeState ? this.runtimeStatesEncoder[stateName] : null === (_b = this.mark.getSpec().encode) || void 0 === _b ? void 0 : _b[stateName];
+            encoder = isRuntimeState ? Object.assign(Object.assign({}, null === (_b = this.mark.getSpec().encode) || void 0 === _b ? void 0 : _b[stateName]), this.runtimeStatesEncoder[stateName]) : null === (_c = this.mark.getSpec().encode) || void 0 === _c ? void 0 : _c[stateName];
           if (!encoder) return {};
           if (isFunction$1(encoder)) return encoder(this.getDatum(), this, stateName, nextStates);
-          if (!isRuntimeState && (null === (_c = this.graphicItem.states) || void 0 === _c ? void 0 : _c[stateName])) return this.graphicItem.states[stateName];
+          if (!isRuntimeState && (null === (_d = this.graphicItem.states) || void 0 === _d ? void 0 : _d[stateName])) return this.graphicItem.states[stateName];
           const stateItems = this.items.map(item => Object.assign({}, item, {
             nextAttrs: {}
           }));
@@ -46060,13 +46108,13 @@
     class GlyphElement extends Element$1 {
       constructor(mark) {
         super(mark), this.getStateAttrs = (stateName, nextStates) => {
-          var _a, _b, _c;
+          var _a, _b, _c, _d;
           const isRuntimeState = !isNil$1(null === (_a = this.runtimeStatesEncoder) || void 0 === _a ? void 0 : _a[stateName]),
-            encoder = isRuntimeState ? this.runtimeStatesEncoder[stateName] : null === (_b = this.mark.getSpec().encode) || void 0 === _b ? void 0 : _b[stateName],
+            encoder = isRuntimeState ? Object.assign(Object.assign({}, null === (_b = this.mark.getSpec().encode) || void 0 === _b ? void 0 : _b[stateName]), this.runtimeStatesEncoder[stateName]) : null === (_c = this.mark.getSpec().encode) || void 0 === _c ? void 0 : _c[stateName],
             glyphStateAttributes = {};
           if (!encoder) return glyphStateAttributes;
           if (isFunction$1(encoder)) return glyphStateAttributes.attributes = encoder(this.getDatum(), this, stateName, nextStates), glyphStateAttributes;
-          if (!isRuntimeState && (null === (_c = this.graphicItem.glyphStates) || void 0 === _c ? void 0 : _c[stateName])) return this.graphicItem.glyphStates[stateName];
+          if (!isRuntimeState && (null === (_d = this.graphicItem.glyphStates) || void 0 === _d ? void 0 : _d[stateName])) return this.graphicItem.glyphStates[stateName];
           if (encoder) {
             const item = this.items[0],
               targetItems = [Object.assign({}, item, {
@@ -47140,9 +47188,18 @@
         this.graphicIndex = markIndex;
       }
       update(spec) {
-        this._context = this.spec.context, this.isUpdated = !0, this.renderContext.progressive || (spec.animation && this.animate.updateConfig(spec.animation), this.animate.updateState(spec.animationState)), this.markType !== GrammarMarkType.group ? (isNil$1(spec.zIndex) || this.graphicItem.setAttribute("zIndex", spec.zIndex), isNil$1(spec.clip) || this.graphicItem.setAttribute("clip", spec.clip), isNil$1(spec.clipPath) || this.graphicItem.setAttribute("path", isArray$1(spec.clipPath) ? spec.clipPath : spec.clipPath(this.elements)), this.elementMap.forEach(element => {
-          element.updateGraphicItem();
-        })) : this.elementMap.forEach(element => {
+        if (this._context = this.spec.context, this.isUpdated = !0, this.renderContext.progressive || (spec.animation && this.animate.updateConfig(spec.animation), this.animate.updateState(spec.animationState)), this.markType !== GrammarMarkType.group) {
+          if (isNil$1(spec.zIndex) || this.graphicItem.setAttribute("zIndex", spec.zIndex), isNil$1(spec.clip) || this.graphicItem.setAttribute("clip", spec.clip), !isNil$1(spec.clipPath)) {
+            const paths = isArray$1(spec.clipPath) ? spec.clipPath : spec.clipPath(this.elements);
+            paths && paths.length ? this.graphicItem.setAttribute("path", paths) : this.graphicItem.setAttributes({
+              path: paths,
+              clip: !1
+            });
+          }
+          this.elementMap.forEach(element => {
+            element.updateGraphicItem();
+          });
+        } else this.elementMap.forEach(element => {
           element.updateGraphicItem();
         });
       }
@@ -47446,7 +47503,11 @@
       getChannelsFromConfig(element) {
         const spec = this.spec,
           initAttrs = {};
-        return isNil$1(spec.clip) || (initAttrs.clip = spec.clip), isNil$1(spec.zIndex) || (initAttrs.zIndex = spec.zIndex), isNil$1(spec.clipPath) || (initAttrs.path = isFunction$1(spec.clipPath) ? spec.clipPath([element]) : spec.clipPath), isNil$1(spec.interactive) || (initAttrs.pickable = spec.interactive), initAttrs;
+        if (isNil$1(spec.clip) || (initAttrs.clip = spec.clip), isNil$1(spec.zIndex) || (initAttrs.zIndex = spec.zIndex), !isNil$1(spec.clipPath)) {
+          const paths = isFunction$1(spec.clipPath) ? spec.clipPath([element]) : spec.clipPath;
+          paths && paths.length ? initAttrs.path = paths : (initAttrs.path = null, initAttrs.clip = !1);
+        }
+        return isNil$1(spec.interactive) || (initAttrs.pickable = spec.interactive), initAttrs;
       }
       evaluateGroupEncode(elements, groupEncode, parameters) {
         var _a;
@@ -50967,8 +51028,8 @@
     };
 
     const fadeIn = (element, options, animationParameters) => {
-      var _a, _b, _c;
-      const finalAttrs = element.getFinalGraphicAttributes();
+      var _a, _b, _c, _d;
+      const finalAttrs = null !== (_a = element.getFinalGraphicAttributes()) && void 0 !== _a ? _a : {};
       return {
         from: {
           opacity: 0,
@@ -50976,9 +51037,9 @@
           strokeOpacity: 0
         },
         to: {
-          opacity: null !== (_a = finalAttrs.opacity) && void 0 !== _a ? _a : 1,
-          fillOpacity: null !== (_b = finalAttrs.fillOpacity) && void 0 !== _b ? _b : 1,
-          strokeOpacity: null !== (_c = finalAttrs.strokeOpacity) && void 0 !== _c ? _c : 1
+          opacity: null !== (_b = finalAttrs.opacity) && void 0 !== _b ? _b : 1,
+          fillOpacity: null !== (_c = finalAttrs.fillOpacity) && void 0 !== _c ? _c : 1,
+          strokeOpacity: null !== (_d = finalAttrs.strokeOpacity) && void 0 !== _d ? _d : 1
         }
       };
     };
@@ -59984,11 +60045,18 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     dependency: stateSignal
                 });
                 if (this._animationConfig.normal) {
-                    this._event.on(exports.VGRAMMAR_HOOK_EVENT.ANIMATION_END, ({ event }) => {
-                        if (event.mark === this.getProduct() && event.animationState === AnimationStateEnum.appear) {
+                    if (!this._animationConfig.appear) {
+                        this._event.on(exports.VGRAMMAR_HOOK_EVENT.AFTER_DO_RENDER, () => {
                             this.runAnimationByState(AnimationStateEnum.normal);
-                        }
-                    });
+                        });
+                    }
+                    else {
+                        this._event.on(exports.VGRAMMAR_HOOK_EVENT.ANIMATION_END, ({ event }) => {
+                            if (event.mark === this.getProduct() && event.animationState === AnimationStateEnum.appear) {
+                                this.runAnimationByState(AnimationStateEnum.normal);
+                            }
+                        });
+                    }
                 }
             }
         }
@@ -66304,7 +66372,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         registerComponentPlugin(CanvasTooltipHandler);
     };
 
-    const version = "1.11.3-alpha.0";
+    const version = "1.11.4";
 
     const addVChartProperty = (data, op) => {
         const context = op.beforeCall();
@@ -70721,10 +70789,10 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this.calcScales(this._defaultBandInnerPadding, this._defaultBandOuterPadding);
         }
         axisHelper() {
-            const getScale = (depth) => {
+            const getScale = (depth = 0) => {
                 return this._scales[depth];
             };
-            const getBandwidth = (depth) => {
+            const getBandwidth = (depth = 0) => {
                 return getScale(depth).bandwidth();
             };
             return {
@@ -71903,8 +71971,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this._chartData.getSeriesData(id, index);
         }
         _transformSpecScale() {
-            var _a, _b;
-            const scales = (_a = this._spec.scales) !== null && _a !== void 0 ? _a : [];
+            var _a;
+            const scales = this._spec.scales ? [...this._spec.scales] : [];
             let colorScaleSpec = scales.find(s => s.id === 'color');
             const colorScheme = this.getColorScheme();
             if (!colorScaleSpec) {
@@ -71930,7 +71998,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     }
                 }
             }
-            if (!((_b = colorScaleSpec.range) === null || _b === void 0 ? void 0 : _b.length)) {
+            if (!((_a = colorScaleSpec.range) === null || _a === void 0 ? void 0 : _a.length)) {
                 colorScaleSpec.range = getDataScheme(colorScheme);
                 colorScaleSpec.rangeTheme = true;
             }
@@ -78872,7 +78940,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         initGroupScales() {
         }
         axisHelper() {
-            const getScale = (depth) => {
+            const getScale = (depth = 0) => {
                 return this._scales[depth];
             };
             const helper = {
@@ -80441,7 +80509,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     let pos;
                     if (isValid$1(originValue)) {
                         const index = binaryFuzzySearch(subTickData, tick => tick.value - originValue);
-                        const targetIndex = originValue > subTickData[index].value - step / 2
+                        const targetIndex = index >= subTickData.length || originValue > subTickData[index].value - step / 2
                             ? Math.min(index, subTickData.length - 1)
                             : index > 0
                                 ? index - 1
@@ -80469,7 +80537,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                     const step = subTickData[1].value - subTickData[0].value;
                     const offsetAngle = degreeToRadian(tickMask.offsetAngle);
                     const index = binaryFuzzySearch(subTickData, tick => tick.value - originValue);
-                    const targetIndex = originValue > subTickData[index].value - step / 2
+                    const targetIndex = index >= subTickData.length || originValue > subTickData[index].value - step / 2
                         ? Math.min(index, subTickData.length - 1)
                         : index > 0
                             ? index - 1
@@ -85948,7 +86016,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         center: center,
         start: left,
         end: right
-      };
+      },
+      linkClampe = clamper(0, 1);
     class SankeyLayout {
       constructor(options) {
         this._ascendingSourceBreadth = (a, b) => ascendingNodeBreadth(this._nodeMap[a.source], this._nodeMap[b.source]) || a.index - b.index, this._ascendingTargetBreadth = (a, b) => ascendingNodeBreadth(this._nodeMap[a.target], this._nodeMap[b.target]) || a.index - b.index, this.options = Object.assign({}, SankeyLayout.defaultOptions, options);
@@ -86259,7 +86328,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         const isStartGap = "start" === this.options.gapPosition,
           isMiddleGap = !isStartGap && "end" !== this.options.gapPosition,
           getNodeHeight = isNumber$1(this.options.nodeHeight) ? node => this.options.nodeHeight : isFunction$1(this.options.nodeHeight) ? this.options.nodeHeight : forceNodeHeight > 0 ? node => forceNodeHeight : node => Math.max(node.value * ky, minNodeHeight, 0),
-          getLinkHeight = isNumber$1(this.options.linkHeight) ? () => this.options.linkHeight : isFunction$1(this.options.linkHeight) ? this.options.linkHeight : (link, sourceNode, sourceNodeHeight) => Math.max(sourceNode.value ? sourceNodeHeight * link.value / sourceNode.value : 0, minLinkHeight, 0);
+          getLinkHeight = isNumber$1(this.options.linkHeight) ? () => this.options.linkHeight : isFunction$1(this.options.linkHeight) ? this.options.linkHeight : (link, sourceNode, sourceNodeHeight) => Math.max(sourceNode.value ? sourceNodeHeight * linkClampe(link.value / sourceNode.value) : 0, minLinkHeight, 0);
         for (let i = 0, columnCount = columns.length; i < columnCount; i++) {
           const nodes = columns[i];
           if (!nodes || !nodes.length) continue;
@@ -86287,7 +86356,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
               }
             }
           } else if (deltaY < 0 && nodes.length > 1 && (deltaY /= nodes.length - 1, gapY + deltaY > 0)) {
-            gapY += deltaY;
+            gapY += deltaY, this._gapY = Math.min(gapY);
             for (let j = 1, len = nodes.length; j < len; ++j) {
               const node = nodes[j];
               node.y0 += deltaY * j, node.y1 += deltaY * j;
@@ -86385,15 +86454,17 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
       computeLinkBreadthsNoOverlap(nodes) {
         for (let i = 0, len = nodes.length; i < len; i++) {
           const node = nodes[i];
-          let y0 = node.y0;
+          let y0 = node.y0,
+            reachBottom = !1;
           for (let j = 0, linkLen = node.sourceLinks.length; j < linkLen; j++) {
             const link = node.sourceLinks[j];
-            link.y0 = y0 + link.thickness / 2, link.x0 = node.x1, y0 += link.thickness;
+            reachBottom || (link.y0 = y0 + link.thickness / 2), link.x0 = node.x1, y0 + link.thickness > node.y1 || reachBottom ? (link.y0 = node.y1 - link.thickness / 2, reachBottom = !0) : y0 += link.thickness;
           }
           let y1 = node.y0;
+          reachBottom = !1;
           for (let j = 0, linkLen = node.targetLinks.length; j < linkLen; j++) {
             const link = node.targetLinks[j];
-            link.y1 = y1 + link.thickness / 2, link.x1 = node.x0, y1 += link.thickness;
+            reachBottom || (link.y1 = y1 + link.thickness / 2), link.x1 = node.x0, y1 + link.thickness > node.y1 || reachBottom ? (link.y1 = node.y1 - link.thickness / 2, reachBottom = !0) : y1 += link.thickness;
           }
         }
       }
@@ -88360,7 +88431,12 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return pointerSpec.height * this._computeLayoutRadius();
         }
         _getPointerAngle(datum) {
-            return this.angleAxisHelper.dataToPosition([datum[this._angleField[0]]]);
+            const scale = this.angleAxisHelper.getScale();
+            const domain = scale.domain();
+            const max = maxInArray(domain);
+            const min = minInArray(domain);
+            const angle = clamp$1(datum[this._angleField[0]], min, max);
+            return this.angleAxisHelper.dataToPosition([angle]);
         }
         _getRotatedPointerCenterOffset(datum) {
             var _a, _b, _c, _d;
@@ -92045,14 +92121,24 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 r.getSeries().forEach(s => {
                     var _a, _b;
                     let activeNodeOrLink = null;
-                    s.getMarks().forEach(m => {
+                    s.getMarksWithoutRoot().forEach(m => {
+                        if (m.type === 'text') {
+                            return;
+                        }
                         let pickElement = null;
                         const mark = m.getProduct();
                         if (!mark) {
                             return;
                         }
                         if (!filter || (isFunction$1(filter) && filter(s, m))) {
-                            pickElement = mark.elements.find((e) => keys.every(k => { var _a, _b; return activeDatum[k] == ((_b = (_a = e.getDatum()) === null || _a === void 0 ? void 0 : _a.datum) === null || _b === void 0 ? void 0 : _b[k]); }));
+                            pickElement = mark.elements.find((e) => keys.every(k => {
+                                var _a;
+                                let datum = (_a = e.getDatum()) === null || _a === void 0 ? void 0 : _a.datum;
+                                if (isArray$1(datum)) {
+                                    datum = datum[0];
+                                }
+                                return activeDatum[k] == (datum === null || datum === void 0 ? void 0 : datum[k]);
+                            }));
                         }
                         if (pickElement) {
                             hasPick = true;