@visactor/vchart 1.11.3 → 1.11.4

package/build/index.es.js

@@ -13235,6 +13235,12 @@ function colorArrayToString(color) {
   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,
@@ -14034,7 +14040,7 @@ class Graphic extends Node {
       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
     });
   }
@@ -14064,7 +14070,7 @@ class Graphic extends Node {
     }), 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) {
@@ -14090,7 +14096,6 @@ class Graphic extends Node {
     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;
@@ -21551,7 +21556,8 @@ var __decorate$1l = undefined && undefined.__decorate || function (decorators, t
     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;
@@ -21568,11 +21574,11 @@ class ShadowRootDrawItemInterceptorContribution {
       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 {
@@ -31237,6 +31243,9 @@ function createTextGraphicByType(textAttributes) {
   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);
@@ -43038,7 +43047,8 @@ let Tooltip$1 = class Tooltip extends AbstractComponent {
       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);
@@ -43089,7 +43099,6 @@ let Tooltip$1 = class Tooltip extends AbstractComponent {
       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}`,
@@ -43097,68 +43106,81 @@ let Tooltip$1 = class Tooltip extends AbstractComponent {
             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({
@@ -51000,8 +51022,8 @@ const clipOut = (element, options, animationParameters) => {
 };
 
 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,
@@ -51009,9 +51031,9 @@ const fadeIn = (element, options, animationParameters) => {
       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
     }
   };
 };
@@ -60017,11 +60039,18 @@ class CompilableMark extends GrammarItem {
                 dependency: stateSignal
             });
             if (this._animationConfig.normal) {
-                this._event.on(HOOK_EVENT.ANIMATION_END, ({ event }) => {
-                    if (event.mark === this.getProduct() && event.animationState === AnimationStateEnum.appear) {
+                if (!this._animationConfig.appear) {
+                    this._event.on(HOOK_EVENT.AFTER_DO_RENDER, () => {
                         this.runAnimationByState(AnimationStateEnum.normal);
-                    }
-                });
+                    });
+                }
+                else {
+                    this._event.on(HOOK_EVENT.ANIMATION_END, ({ event }) => {
+                        if (event.mark === this.getProduct() && event.animationState === AnimationStateEnum.appear) {
+                            this.runAnimationByState(AnimationStateEnum.normal);
+                        }
+                    });
+                }
             }
         }
     }
@@ -66337,7 +66366,7 @@ const registerCanvasTooltipHandler = () => {
     registerComponentPlugin(CanvasTooltipHandler);
 };
 
-const version = "1.11.3";
+const version = "1.11.4";
 
 const addVChartProperty = (data, op) => {
     const context = op.beforeCall();
@@ -70754,10 +70783,10 @@ class CartesianBandAxis extends CartesianAxis {
         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 {
@@ -71936,8 +71965,8 @@ class BaseChart extends CompilableBase {
         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) {
@@ -71963,7 +71992,7 @@ class BaseChart extends CompilableBase {
                 }
             }
         }
-        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;
         }
@@ -78905,7 +78934,7 @@ class PolarAxis extends AxisComponent {
     initGroupScales() {
     }
     axisHelper() {
-        const getScale = (depth) => {
+        const getScale = (depth = 0) => {
             return this._scales[depth];
         };
         const helper = {
@@ -80474,7 +80503,7 @@ class ProgressLikeSeries extends PolarSeries {
                 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
@@ -80502,7 +80531,7 @@ class ProgressLikeSeries extends PolarSeries {
                 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
@@ -88396,7 +88425,12 @@ class GaugePointerSeries extends ProgressLikeSeries {
         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;