@visactor/vrender-components 0.23.0-alpha.3 → 1.0.0-alpha.10

package/cjs/label/animate/animate.d.ts

@@ -1,13 +1,2 @@
-import type { IText, ITextGraphicAttribute, EasingType } from '@visactor/vrender-core';
-import type { ILabelAnimation, ILabelUpdateAnimation, ILabelUpdateChannelAnimation, LabelContent } from '../type';
-export declare function getAnimationAttributes(textAttribute: ITextGraphicAttribute, type: 'fadeIn' | 'fadeOut'): {
-    from: any;
-    to: any;
-};
-export declare function updateAnimation(prev: LabelContent['text'], next: LabelContent['text'], animationConfig: ILabelUpdateAnimation | ILabelUpdateChannelAnimation[]): void;
-export declare const update: (prev: LabelContent['text'], next: LabelContent['text'], channel?: string[], options?: ILabelUpdateChannelAnimation['options']) => {
-    from: Partial<ITextGraphicAttribute> | Partial<import("@visactor/vrender-core").IRichTextGraphicAttribute>;
-    to: Partial<ITextGraphicAttribute> | Partial<import("@visactor/vrender-core").IRichTextGraphicAttribute>;
-};
-export declare function playIncreaseCount(prev: IText, next: IText, duration: number, easing: EasingType): void;
+import type { ILabelAnimation } from '../type';
 export declare const DefaultLabelAnimation: ILabelAnimation;

package/cjs/label/animate/animate.js

@@ -2,84 +2,7 @@
 
 Object.defineProperty(exports, "__esModule", {
     value: !0
-}), exports.DefaultLabelAnimation = exports.playIncreaseCount = exports.update = exports.updateAnimation = exports.getAnimationAttributes = void 0;
-
-const vrender_animate_1 = require("@visactor/vrender-animate"), vutils_1 = require("@visactor/vutils"), fadeIn = (textAttribute = {}) => {
-    var _a, _b, _c;
-    return {
-        from: {
-            opacity: 0,
-            fillOpacity: 0,
-            strokeOpacity: 0
-        },
-        to: {
-            opacity: null !== (_a = textAttribute.opacity) && void 0 !== _a ? _a : 1,
-            fillOpacity: null !== (_b = textAttribute.fillOpacity) && void 0 !== _b ? _b : 1,
-            strokeOpacity: null !== (_c = textAttribute.strokeOpacity) && void 0 !== _c ? _c : 1
-        }
-    };
-}, fadeOut = (textAttribute = {}) => {
-    var _a, _b, _c;
-    return {
-        from: {
-            opacity: null !== (_a = textAttribute.opacity) && void 0 !== _a ? _a : 1,
-            fillOpacity: null !== (_b = textAttribute.fillOpacity) && void 0 !== _b ? _b : 1,
-            strokeOpacity: null !== (_c = textAttribute.strokeOpacity) && void 0 !== _c ? _c : 1
-        },
-        to: {
-            opacity: 0,
-            fillOpacity: 0,
-            strokeOpacity: 0
-        }
-    };
-}, animationEffects = {
-    fadeIn: fadeIn,
-    fadeOut: fadeOut
-};
-
-function getAnimationAttributes(textAttribute, type) {
-    var _a, _b;
-    return null !== (_b = null === (_a = animationEffects[type]) || void 0 === _a ? void 0 : _a.call(animationEffects, textAttribute)) && void 0 !== _b ? _b : {
-        from: {},
-        to: {}
-    };
-}
-
-function updateAnimation(prev, next, animationConfig) {
-    if (!(0, vutils_1.isArray)(animationConfig)) {
-        const {duration: duration, easing: easing, increaseEffect: increaseEffect = !0} = animationConfig;
-        return prev.animate().to(next.attribute, duration, easing), void (increaseEffect && "text" === prev.type && "text" === next.type && playIncreaseCount(prev, next, duration, easing));
-    }
-    animationConfig.forEach((cfg => {
-        const {duration: duration, easing: easing, increaseEffect: increaseEffect = !0, channel: channel} = cfg, {to: to} = (0, 
-        exports.update)(prev, next, channel, cfg.options);
-        (0, vutils_1.isEmpty)(to) || prev.animate().to(to, duration, easing), increaseEffect && "text" === prev.type && "text" === next.type && playIncreaseCount(prev, next, duration, easing);
-    }));
-}
-
-exports.getAnimationAttributes = getAnimationAttributes, exports.updateAnimation = updateAnimation;
-
-const update = (prev, next, channel, options) => {
-    const from = Object.assign({}, prev.attribute), to = Object.assign({}, next.attribute);
-    return (0, vutils_1.array)(null == options ? void 0 : options.excludeChannels).forEach((key => {
-        delete to[key];
-    })), Object.keys(to).forEach((key => {
-        channel && !channel.includes(key) && delete to[key];
-    })), {
-        from: from,
-        to: to
-    };
-};
-
-function playIncreaseCount(prev, next, duration, easing) {
-    prev.attribute.text !== next.attribute.text && (0, vutils_1.isValidNumber)(Number(prev.attribute.text) * Number(next.attribute.text)) && prev.animate().play(new vrender_animate_1.IncreaseCount({
-        text: prev.attribute.text
-    }, {
-        text: next.attribute.text
-    }, duration, easing));
-}
-
-exports.update = update, exports.playIncreaseCount = playIncreaseCount, exports.DefaultLabelAnimation = {
+}), exports.DefaultLabelAnimation = void 0, exports.DefaultLabelAnimation = {
     mode: "same-time",
     duration: 300,
     easing: "linear"

package/cjs/label/animate/animate.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/label/animate/animate.ts"],"names":[],"mappings":"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","file":"animate.js","sourcesContent":["import type { IText, ITextGraphicAttribute, EasingType } from '@visactor/vrender-core';\nimport { IncreaseCount } from '@visactor/vrender-animate';\nimport type { ILabelAnimation, ILabelUpdateAnimation, ILabelUpdateChannelAnimation, LabelContent } from '../type';\nimport { array, isArray, isEmpty, isValidNumber } from '@visactor/vutils';\n\nconst fadeIn = (textAttribute: ITextGraphicAttribute = {}) => {\n  return {\n    from: {\n      opacity: 0,\n      fillOpacity: 0,\n      strokeOpacity: 0\n    },\n    to: {\n      opacity: textAttribute.opacity ?? 1,\n      fillOpacity: textAttribute.fillOpacity ?? 1,\n      strokeOpacity: textAttribute.strokeOpacity ?? 1\n    }\n  };\n};\n\nconst fadeOut = (textAttribute: ITextGraphicAttribute = {}) => {\n  return {\n    from: {\n      opacity: textAttribute.opacity ?? 1,\n      fillOpacity: textAttribute.fillOpacity ?? 1,\n      strokeOpacity: textAttribute.strokeOpacity ?? 1\n    },\n    to: {\n      opacity: 0,\n      fillOpacity: 0,\n      strokeOpacity: 0\n    }\n  };\n};\n\nconst animationEffects = { fadeIn, fadeOut };\n\nexport function getAnimationAttributes(\n  textAttribute: ITextGraphicAttribute,\n  type: 'fadeIn' | 'fadeOut'\n): {\n  from: any;\n  to: any;\n} {\n  return animationEffects[type]?.(textAttribute) ?? { from: {}, to: {} };\n}\n\nexport function updateAnimation(\n  prev: LabelContent['text'],\n  next: LabelContent['text'],\n  animationConfig: ILabelUpdateAnimation | ILabelUpdateChannelAnimation[]\n) {\n  if (!isArray(animationConfig)) {\n    const { duration, easing, increaseEffect = true } = animationConfig;\n    prev.animate().to(next.attribute, duration, easing);\n    if (increaseEffect && prev.type === 'text' && next.type === 'text') {\n      playIncreaseCount(prev as IText, next as IText, duration, easing);\n    }\n    return;\n  }\n\n  animationConfig.forEach(cfg => {\n    const { duration, easing, increaseEffect = true, channel } = cfg;\n    const { to } = update(prev, next, channel, cfg.options);\n    if (!isEmpty(to)) {\n      prev.animate().to(to, duration, easing);\n    }\n\n    if (increaseEffect && prev.type === 'text' && next.type === 'text') {\n      playIncreaseCount(prev as IText, next as IText, duration, easing);\n    }\n  });\n}\n\nexport const update = (\n  prev: LabelContent['text'],\n  next: LabelContent['text'],\n  channel?: string[],\n  options?: ILabelUpdateChannelAnimation['options']\n) => {\n  const from = Object.assign({}, prev.attribute);\n  const to = Object.assign({}, next.attribute);\n  array(options?.excludeChannels).forEach(key => {\n    delete to[key];\n  });\n  Object.keys(to).forEach(key => {\n    if (channel && !channel.includes(key)) {\n      delete to[key];\n    }\n  });\n  return { from, to };\n};\n\nexport function playIncreaseCount(prev: IText, next: IText, duration: number, easing: EasingType) {\n  if (\n    prev.attribute.text !== next.attribute.text &&\n    isValidNumber(Number(prev.attribute.text) * Number(next.attribute.text))\n  ) {\n    prev\n      .animate()\n      .play(\n        new IncreaseCount(\n          { text: prev.attribute.text as string },\n          { text: next.attribute.text as string },\n          duration,\n          easing\n        ) as any\n      );\n  }\n}\n\nexport const DefaultLabelAnimation: ILabelAnimation = {\n  mode: 'same-time',\n  duration: 300,\n  easing: 'linear' as EasingType\n};\n"]}
+{"version":3,"sources":["../src/label/animate/animate.ts"],"names":[],"mappings":";;;AAGa,QAAA,qBAAqB,GAAoB;IACpD,IAAI,EAAE,WAAW;IACjB,QAAQ,EAAE,GAAG;IACb,MAAM,EAAE,QAAsB;CAC/B,CAAC","file":"animate.js","sourcesContent":["import type { EasingType } from '@visactor/vrender-core';\nimport type { ILabelAnimation } from '../type';\n\nexport const DefaultLabelAnimation: ILabelAnimation = {\n  mode: 'same-time',\n  duration: 300,\n  easing: 'linear' as EasingType\n};\n"]}

package/cjs/label/base.d.ts

@@ -1,12 +1,12 @@
 import type { IGroup, IGraphic, IText, ILine, IRichText } from '@visactor/vrender-core';
 import type { IAABBBounds, IBoundsLike, IPointLike } from '@visactor/vutils';
-import { AbstractComponent } from '../core/base';
 import type { PointLocationCfg } from '../core/type';
 import type { Bitmap, BitmapTool } from './overlap';
 import { bitmapTool } from './overlap';
 import type { BaseLabelAttrs, OverlapAttrs, LabelItem, ILabelEnterAnimation, ILabelExitAnimation, ILabelUpdateAnimation, LabelContent } from './type';
 import type { ComponentOptions } from '../interface';
-export declare class LabelBase<T extends BaseLabelAttrs> extends AbstractComponent<T> {
+import { AnimateComponent } from '../animation/animate-component';
+export declare class LabelBase<T extends BaseLabelAttrs> extends AnimateComponent<T> {
     name: string;
     protected _baseMarks?: IGraphic[];
     protected _isCollectionBase: boolean;
@@ -52,11 +52,13 @@ export declare class LabelBase<T extends BaseLabelAttrs> extends AbstractCompone
     protected _overlapGlobal(labels: (IText | IRichText)[], option: OverlapAttrs, bmpTool: BitmapTool, bitmap: Bitmap): (IRichText | IText)[];
     protected _processClampForce(text: IText, bmpTool: BitmapTool, bitmap: Bitmap, overlapPadding?: number): boolean;
     protected _overlapByStrategy(labels: (IText | IRichText)[], option: OverlapAttrs, bmpTool: BitmapTool, bitmap: Bitmap): (IRichText | IText)[];
+    protected isMarkInsideRect(baseMark: IGraphic, bmpTool: BitmapTool): boolean;
     protected getBaseMarkGroup(): IGroup;
     protected getGraphicBounds(graphic?: IGraphic, point?: Partial<PointLocationCfg>, position?: string): IBoundsLike;
     protected _renderLabels(labels: (IText | IRichText)[]): void;
-    protected runEnterAnimation(text: IText | IRichText): void;
+    protected runEnterAnimation(text: IText | IRichText, labelLine?: ILine): void;
     protected _runUpdateAnimation(prevLabel: LabelContent, currentLabel: LabelContent): void;
+    protected _syncStateWithRelatedGraphic(relatedGraphic: IGraphic): void;
     protected _addLabel(label: LabelContent, texts?: LabelContent['text'][], labelLines?: LabelContent['labelLine'][], index?: number): void;
     protected _updateLabel(prevLabel: LabelContent, currentLabel: LabelContent): void;
     protected _removeLabel(textMap: Map<any, LabelContent>): void;

package/cjs/label/base.js

@@ -14,11 +14,11 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.LabelBase = void 0;
 
-const vrender_core_1 = require("@visactor/vrender-core"), vutils_1 = require("@visactor/vutils"), base_1 = require("../core/base"), label_smartInvert_1 = require("../util/label-smartInvert"), util_1 = require("../util"), constant_1 = require("../constant"), overlap_1 = require("./overlap"), animate_1 = require("./animate/animate"), util_2 = require("./util"), register_1 = require("./register"), shiftY_1 = require("./overlap/shiftY");
+const vrender_core_1 = require("@visactor/vrender-core"), vutils_1 = require("@visactor/vutils"), label_smartInvert_1 = require("../util/label-smartInvert"), util_1 = require("../util"), constant_1 = require("../constant"), overlap_1 = require("./overlap"), animate_1 = require("./animate/animate"), util_2 = require("./util"), register_1 = require("./register"), shiftY_1 = require("./overlap/shiftY"), animate_component_1 = require("../animation/animate-component");
 
 (0, register_1.loadLabelComponent)();
 
-class LabelBase extends base_1.AbstractComponent {
+class LabelBase extends animate_component_1.AnimateComponent {
     setBitmap(bitmap) {
         this._bitmap = bitmap;
     }
@@ -85,6 +85,10 @@ class LabelBase extends base_1.AbstractComponent {
     render() {
         if (this._prepare(), (0, vutils_1.isNil)(this._idToGraphic) || this._isCollectionBase && (0, 
         vutils_1.isNil)(this._idToPoint)) return;
+        const markAttributeList = [];
+        !1 !== this._enableAnimation && this._baseMarks.forEach((mark => {
+            markAttributeList.push(mark.attribute), mark.initAttributes(mark.getAttributes(!0));
+        }));
         const {overlap: overlap, smartInvert: smartInvert, dataFilter: dataFilter, customLayoutFunc: customLayoutFunc, customOverlapFunc: customOverlapFunc} = this.attribute;
         let data = this.attribute.data;
         if ((0, vutils_1.isFunction)(dataFilter) && (data = dataFilter(data)), data && data.length) {
@@ -97,7 +101,10 @@ class LabelBase extends base_1.AbstractComponent {
         (0, vutils_1.isFunction)(this.attribute.onAfterOverlapping) && this.attribute.onAfterOverlapping(labels, this.getRelatedGraphic.bind(this), this._isCollectionBase ? d => this._idToPoint.get(d.id) : null, this), 
         labels && labels.length && labels.forEach((label => {
             this._bindEvent(label), this._setStatesOfText(label);
-        })), !1 !== smartInvert && this._smartInvert(labels), this._renderLabels(labels);
+        })), !1 !== smartInvert && this._smartInvert(labels), this._renderLabels(labels), 
+        !1 !== this._enableAnimation && this._baseMarks.forEach(((mark, index) => {
+            mark.initAttributes(markAttributeList[index]);
+        }));
     }
     _bindEvent(target) {
         if (this.attribute.disableTriggerEvent) return;
@@ -150,20 +157,7 @@ class LabelBase extends base_1.AbstractComponent {
                 textData && baseMark && ((0, vutils_1.isValid)(textData.id) || (textData.id = `vrender-component-${this.name}-${i}`), 
                 this._idToGraphic.set(textData.id, baseMark));
             }
-            if (!1 !== this.attribute.animation) {
-                const {animation: animation, animationEnter: animationEnter, animationExit: animationExit, animationUpdate: animationUpdate} = this.attribute, animationCfg = (0, 
-                vutils_1.isObject)(animation) ? animation : {};
-                this._animationConfig = {
-                    enter: !1 !== animationEnter && (0, vutils_1.merge)({}, animate_1.DefaultLabelAnimation, animationCfg, null != animationEnter ? animationEnter : {}),
-                    exit: !1 !== animationExit && (0, vutils_1.merge)({}, animate_1.DefaultLabelAnimation, animationCfg, null != animationExit ? animationExit : {}),
-                    update: !1 !== animationUpdate && ((0, vutils_1.isArray)(animationUpdate) ? animationUpdate : (0, 
-                    vutils_1.merge)({}, animate_1.DefaultLabelAnimation, animationCfg, null != animationUpdate ? animationUpdate : {}))
-                };
-            } else this._animationConfig = {
-                enter: !1,
-                exit: !1,
-                update: !1
-            };
+            this._prepareAnimate(animate_1.DefaultLabelAnimation);
         }
     }
     getRelatedGraphic(item) {
@@ -213,7 +207,7 @@ class LabelBase extends base_1.AbstractComponent {
         "shiftY" === (null == strategy ? void 0 : strategy.type) ? this._overlapGlobal(labels, option, bmpTool, bitmap) : this._overlapByStrategy(labels, option, bmpTool, bitmap);
     }
     _overlapGlobal(labels, option, bmpTool, bitmap) {
-        let result = labels.filter((label => label.attribute.visible && 0 !== label.attribute.opacity));
+        let result = labels.filter((label => label.attribute.visible && 0 !== label.attribute.opacity && this.isMarkInsideRect(this.getRelatedGraphic(label.attribute), bmpTool)));
         const {clampForce: clampForce = !0, hideOnHit: hideOnHit = !0, overlapPadding: overlapPadding, strategy: strategy} = option;
         if (clampForce) for (let i = 0; i < result.length; i++) {
             const text = labels[i], {dx: dx = 0, dy: dy = 0} = (0, overlap_1.clampText)(text, bmpTool.width, bmpTool.height, bmpTool.padding);
@@ -273,12 +267,7 @@ class LabelBase extends base_1.AbstractComponent {
         for (let i = 0; i < labels.length; i++) {
             if (!1 === labels[i].attribute.visible) continue;
             const text = labels[i], baseMark = this.getRelatedGraphic(text.attribute);
-            if (text.update(), !(0, vutils_1.isRectIntersect)(baseMark.AABBBounds, {
-                x1: 0,
-                x2: bmpTool.width,
-                y1: 0,
-                y2: bmpTool.height
-            }, !0)) continue;
+            if (text.update(), !this.isMarkInsideRect(baseMark, bmpTool)) continue;
             if ((0, overlap_1.canPlace)(bmpTool, bitmap, text.AABBBounds, clampForce, overlapPadding)) {
                 if (!checkBounds) {
                     bitmap.setRange((0, overlap_1.boundToRange)(bmpTool, text.AABBBounds, !0)), result.push(text);
@@ -308,13 +297,41 @@ class LabelBase extends base_1.AbstractComponent {
         }
         return result;
     }
+    isMarkInsideRect(baseMark, bmpTool) {
+        const {left: left, right: right, top: top, bottom: bottom} = bmpTool.padding, rect = {
+            x1: -left,
+            x2: bmpTool.width + right,
+            y1: -top,
+            y2: bmpTool.height + bottom
+        }, bounds = baseMark.AABBBounds;
+        if (0 !== bounds.width() && 0 !== bounds.height()) return (0, vutils_1.isRectIntersect)(baseMark.AABBBounds, rect, !0);
+        const {attribute: attribute} = baseMark;
+        if ("rect" === baseMark.type) {
+            const {x: x, x1: x1, y: y, y1: y1} = attribute;
+            return (0, vutils_1.pointInRect)({
+                x: null != x ? x : x1,
+                y: null != y ? y : y1
+            }, rect, !0);
+        }
+        return "x" in attribute && "y" in attribute && (0, vutils_1.pointInRect)({
+            x: attribute.x,
+            y: attribute.y
+        }, rect, !0);
+    }
     getBaseMarkGroup() {
         const {baseMarkGroupName: baseMarkGroupName} = this.attribute;
         if (baseMarkGroupName) return this.getRootNode().find((node => node.name === baseMarkGroupName), !0);
     }
     getGraphicBounds(graphic, point = {}, position) {
+        var _a;
         if (graphic) {
-            if (!1 !== graphic.attribute.visible) return graphic.AABBBounds;
+            if (!1 !== graphic.attribute.visible) {
+                if (null === (_a = graphic.context) || void 0 === _a ? void 0 : _a.animationState) {
+                    const clonedGraphic = graphic.clone();
+                    return Object.assign(clonedGraphic.attribute, graphic.getAttributes(!0)), clonedGraphic.AABBBounds;
+                }
+                return graphic.AABBBounds;
+            }
             const {x: x, y: y} = graphic.attribute;
             return {
                 x1: x,
@@ -371,18 +388,23 @@ class LabelBase extends base_1.AbstractComponent {
             }
         })), this._removeLabel(prevTextMap), this._graphicToText = currentTextMap;
     }
-    runEnterAnimation(text) {
+    runEnterAnimation(text, labelLine) {
         if (!1 === this._enableAnimation || !this._animationConfig.enter) return;
         const relatedGraphic = this.getRelatedGraphic(text.attribute), {enter: enter} = this._animationConfig;
-        text.applyAnimationState([ "enter" ], [ {
+        [ text, labelLine ].filter(Boolean).forEach((item => item.applyAnimationState([ "enter" ], [ {
             name: "enter",
             animation: Object.assign(Object.assign({}, enter), {
+                type: "labelEnter",
                 selfOnly: !0,
                 customParameters: {
-                    relatedGraphic: relatedGraphic
+                    relatedGraphic: relatedGraphic,
+                    relatedGraphics: this._idToGraphic,
+                    config: Object.assign(Object.assign({}, enter), {
+                        type: item === text ? enter.type : "fadeIn"
+                    })
                 }
             })
-        } ]);
+        } ])));
     }
     _runUpdateAnimation(prevLabel, currentLabel) {
         if (!1 === this._enableAnimation || !this._animationConfig.update) return;
@@ -402,9 +424,13 @@ class LabelBase extends base_1.AbstractComponent {
             }
         } ]);
     }
+    _syncStateWithRelatedGraphic(relatedGraphic) {
+        this.attribute.syncState && relatedGraphic && relatedGraphic.on("afterStateUpdate", this._handleRelatedGraphicSetState);
+    }
     _addLabel(label, texts, labelLines, index) {
-        const {text: text, labelLine: labelLine} = label;
-        text && this.add(text), labelLine && this.add(labelLine), this.runEnterAnimation(text);
+        const {text: text, labelLine: labelLine} = label, relatedGraphic = this.getRelatedGraphic(text.attribute);
+        this._syncStateWithRelatedGraphic(relatedGraphic), text && this.add(text), labelLine && this.add(labelLine), 
+        this.runEnterAnimation(text, labelLine);
     }
     _updateLabel(prevLabel, currentLabel) {
         const {text: prevText, labelLine: prevLabelLine} = prevLabel, {text: curText, labelLine: curLabelLine} = currentLabel;
@@ -419,16 +445,16 @@ class LabelBase extends base_1.AbstractComponent {
             var _a;
             label.text.applyAnimationState([ "exit" ], [ {
                 name: "exit",
-                animation: Object.assign({
+                animation: Object.assign(Object.assign({}, this._animationConfig.exit), {
                     type: "fadeOut"
-                }, this._animationConfig.exit)
+                })
             } ], (() => {
                 removeLabelAndLine(label);
             })), null === (_a = label.labelLine) || void 0 === _a || _a.applyAnimationState([ "exit" ], [ {
                 name: "exit",
-                animation: Object.assign({
+                animation: Object.assign(Object.assign({}, this._animationConfig.exit), {
                     type: "fadeOut"
-                }, this._animationConfig.exit)
+                })
             } ], (() => {}));
         })) : textMap.forEach((label => {
             removeLabelAndLine(label);