@visactor/vgrammar-core 0.7.0

package/es/graph/animation/animator.js

@@ -0,0 +1,83 @@
+import { isNil, isValidNumber } from "@visactor/vutils";
+
+import { ACustomAnimate, Animate, AnimateGroup, AnimateMode } from "@visactor/vrender";
+
+import { AttributeAnimate, channelAnimationAttributes, CustomInterpolator, typeAnimationAttributes } from "./attribute";
+
+Animate.mode |= AnimateMode.SET_ATTR_IMMEDIATELY;
+
+let GlobalAnimatorId = 0;
+
+const isCustomAnimateCtor = custom => !isNil(custom) && custom.prototype instanceof ACustomAnimate;
+
+export class Animator {
+    constructor(element, unit, animationOptions) {
+        this.id = GlobalAnimatorId++, this.isAnimating = !1, this.runnings = [], this.element = element, 
+        this.animationOptions = animationOptions, this.unit = unit;
+    }
+    callback(callbackFunction) {
+        return this.callbackFunction = callbackFunction, this;
+    }
+    animate(animationParameters, parameters) {
+        return this.isAnimating = !0, this.animateElement(animationParameters, parameters), 
+        0 === this.runnings.length && this.animationEnd(), this;
+    }
+    stop(stopState = "end", invokeCallback = !0) {
+        return this.runnings.forEach((running => running.stop(stopState))), this.animationEnd(invokeCallback), 
+        this;
+    }
+    pause() {
+        return this.runnings.forEach((running => running.pause())), this;
+    }
+    resume() {
+        return this.runnings.forEach((running => running.resume())), this;
+    }
+    startAt(startTime) {
+        return this.runnings.forEach((running => {
+            const initialDelay = this.unit.initialDelay;
+            running.startAt(initialDelay + startTime);
+        })), this;
+    }
+    getTotalAnimationTime() {
+        var _a;
+        const timeLineDuration = this.unit.initialDelay + this.unit.loopDuration * this.unit.loopCount;
+        return null !== (_a = this.unit.totalTime) && void 0 !== _a ? _a : timeLineDuration;
+    }
+    getEndAttributes() {
+        return this.runnings.reduce(((attributes, running) => Object.assign(attributes, running.getEndProps())), {});
+    }
+    animationEnd(invokeCallback = !0) {
+        var _a;
+        this.isAnimating = !1, this.runnings = null, invokeCallback && (null === (_a = this.callbackFunction) || void 0 === _a || _a.call(null));
+    }
+    animateElement(animationParameters, parameters) {
+        const graphicAnimate = this.element.getGraphicItem().animate();
+        this.runnings.push(graphicAnimate), graphicAnimate.startAt(this.unit.initialDelay), 
+        graphicAnimate.wait(this.unit.loopDelay), this.unit.timeSlices.forEach((timeSlice => {
+            this.animateTimeSlice(graphicAnimate, timeSlice, animationParameters, parameters);
+        })), graphicAnimate.wait(this.unit.loopDelayAfter), graphicAnimate.loop(this.unit.loopCount - 1), 
+        isValidNumber(this.unit.totalTime) && setTimeout((() => {
+            graphicAnimate && graphicAnimate.stop("end");
+        }), this.unit.totalTime), graphicAnimate.onEnd((() => {
+            this.runnings = this.runnings.filter((running => running !== graphicAnimate)), 0 === this.runnings.length && this.animationEnd();
+        }));
+    }
+    animateTimeSlice(graphicAnimate, timeSlice, animationParameters, parameters) {
+        const delay = timeSlice.delay, duration = timeSlice.duration, effects = timeSlice.effects;
+        if (delay > 0 && graphicAnimate.wait(delay), effects.length < 0) graphicAnimate.wait(duration); else {
+            const customAnimates = effects.map(((effect, index) => {
+                var _a;
+                const attributes = null !== (_a = effect.type ? typeAnimationAttributes(this.element, effect, animationParameters, parameters) : channelAnimationAttributes(this.element, effect, animationParameters, parameters)) && void 0 !== _a ? _a : {}, customOption = (null == attributes ? void 0 : attributes.custom) || (null == effect ? void 0 : effect.custom), customParametersOption = (null == attributes ? void 0 : attributes.customParameters) || (null == effect ? void 0 : effect.customParameters);
+                attributes.from && Object.keys(attributes.from).length && this.unit && this.animationOptions.timeline.controlOptions.immediatelyApply && "component" !== this.element.mark.markType && this.element.getGraphicItem().setAttributes(attributes.from);
+                const isCustomAnimate = isCustomAnimateCtor(customOption);
+                return !isNil(customOption) && !isCustomAnimateCtor(customOption) ? new CustomInterpolator(attributes.from, attributes.to, duration, effect.easing, {
+                    interpolator: customOption,
+                    element: this.element,
+                    parameters: customParametersOption
+                }) : isCustomAnimate ? new customOption(attributes.from, attributes.to, duration, effect.easing, customParametersOption) : attributes.to ? new AttributeAnimate(attributes.from, attributes.to, duration, effect.easing) : void 0;
+            })).filter((animate => !isNil(animate)));
+            1 === customAnimates.length ? graphicAnimate.play(customAnimates[0]) : graphicAnimate.play(new AnimateGroup(duration, customAnimates));
+        }
+    }
+}
+//# sourceMappingURL=animator.js.map

package/es/graph/animation/animator.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/graph/animation/animator.ts"],"names":[],"mappings":"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","file":"animator.js","sourcesContent":["import { isNil, isValidNumber } from '@visactor/vutils';\nimport type { IAnimate as IGraphicAnimate } from '@visactor/vrender';\n// eslint-disable-next-line no-duplicate-imports\nimport { ACustomAnimate, Animate, AnimateGroup, AnimateMode } from '@visactor/vrender';\nimport type {\n  IAnimationChannelInterpolator,\n  IAnimationCustomConstructor,\n  IAnimationTimeline,\n  IAnimator,\n  IAnimatorOptions,\n  IAnimationUnit,\n  IAnimationParameters,\n  IAnimationTimeSlice,\n  IElement,\n  IAnimationEffect\n} from '../../types';\nimport { AttributeAnimate, channelAnimationAttributes, CustomInterpolator, typeAnimationAttributes } from './attribute';\n\nAnimate.mode |= AnimateMode.SET_ATTR_IMMEDIATELY;\n\nlet GlobalAnimatorId = 0;\n\nconst isCustomAnimateCtor = (custom?: IAnimationChannelInterpolator | IAnimationCustomConstructor) => {\n  return !isNil(custom) && custom.prototype instanceof ACustomAnimate;\n};\n\nexport class Animator implements IAnimator {\n  id: number = GlobalAnimatorId++;\n  element: IElement;\n  animationOptions: IAnimatorOptions;\n  isAnimating: boolean = false;\n\n  private unit: IAnimationUnit;\n  private runnings: IGraphicAnimate[] = [];\n  private callbackFunction: (...args: any[]) => any;\n\n  constructor(\n    element: IElement,\n    unit: IAnimationUnit,\n    animationOptions: {\n      state: string;\n      timeline: IAnimationTimeline;\n      id: string;\n    }\n  ) {\n    this.element = element;\n    this.animationOptions = animationOptions;\n    this.unit = unit;\n  }\n\n  callback(callbackFunction: (...args: any[]) => void): this {\n    this.callbackFunction = callbackFunction;\n    return this;\n  }\n\n  animate(animationParameters: IAnimationParameters, parameters: any): this {\n    this.isAnimating = true;\n\n    this.animateElement(animationParameters, parameters);\n\n    // if no valid running, end animating immediately\n    if (this.runnings.length === 0) {\n      this.animationEnd();\n    }\n    return this;\n  }\n\n  stop(stopState: 'start' | 'end' = 'end', invokeCallback: boolean = true): this {\n    // FIXME: wait for VRender to fix 'end' parameter\n    this.runnings.forEach(running => running.stop(stopState));\n    this.animationEnd(invokeCallback);\n    return this;\n  }\n\n  pause(): this {\n    this.runnings.forEach(running => running.pause());\n    return this;\n  }\n\n  resume(): this {\n    this.runnings.forEach(running => running.resume());\n    return this;\n  }\n\n  startAt(startTime: number): this {\n    this.runnings.forEach(running => {\n      const initialDelay = this.unit.initialDelay;\n      running.startAt(initialDelay + startTime);\n    });\n    return this;\n  }\n\n  getTotalAnimationTime() {\n    const timeLineDuration = this.unit.initialDelay + this.unit.loopDuration * this.unit.loopCount;\n    return this.unit.totalTime ?? timeLineDuration;\n  }\n\n  getEndAttributes() {\n    return this.runnings.reduce((attributes, running) => {\n      return Object.assign(attributes, running.getEndProps());\n    }, {} as Record<string, any>);\n  }\n\n  private animationEnd(invokeCallback: boolean = true) {\n    this.isAnimating = false;\n    this.runnings = null;\n    if (invokeCallback) {\n      this.callbackFunction?.call(null);\n    }\n  }\n\n  private animateElement(animationParameters: IAnimationParameters, parameters: any) {\n    const graphicAnimate: IGraphicAnimate = this.element.getGraphicItem().animate();\n    this.runnings.push(graphicAnimate);\n    // initialDelay is only used at first loop\n    graphicAnimate.startAt(this.unit.initialDelay);\n    // execute loop animation\n    graphicAnimate.wait(this.unit.loopDelay);\n    this.unit.timeSlices.forEach(timeSlice => {\n      this.animateTimeSlice(graphicAnimate, timeSlice, animationParameters, parameters);\n    });\n    graphicAnimate.wait(this.unit.loopDelayAfter);\n\n    graphicAnimate.loop(this.unit.loopCount - 1);\n\n    if (isValidNumber(this.unit.totalTime)) {\n      // FIXME: use VRender api instead after VRender refactor is finished\n      setTimeout(() => {\n        if (graphicAnimate) {\n          graphicAnimate.stop('end');\n        }\n      }, this.unit.totalTime);\n    }\n\n    graphicAnimate.onEnd(() => {\n      this.runnings = this.runnings.filter(running => running !== graphicAnimate);\n      if (this.runnings.length === 0) {\n        this.animationEnd();\n      }\n    });\n  }\n\n  private animateTimeSlice(\n    graphicAnimate: IGraphicAnimate,\n    timeSlice: IAnimationTimeSlice,\n    animationParameters: IAnimationParameters,\n    parameters: any\n  ) {\n    const delay = timeSlice.delay as number;\n    const duration = timeSlice.duration as number;\n    const effects = timeSlice.effects as IAnimationEffect[];\n\n    // wait in loop animation before animation starts\n    if (delay > 0) {\n      graphicAnimate.wait(delay);\n    }\n\n    if (effects.length < 0) {\n      graphicAnimate.wait(duration);\n    } else {\n      const customAnimates = effects\n        .map((effect, index) => {\n          const attributes =\n            (effect.type\n              ? typeAnimationAttributes(this.element, effect, animationParameters, parameters)\n              : channelAnimationAttributes(this.element, effect, animationParameters, parameters)) ?? {};\n          const customOption = attributes?.custom || effect?.custom;\n          const customParametersOption = attributes?.customParameters || effect?.customParameters;\n\n          if (\n            attributes.from &&\n            Object.keys(attributes.from).length &&\n            this.unit &&\n            this.animationOptions.timeline.controlOptions.immediatelyApply &&\n            this.element.mark.markType !== 'component'\n          ) {\n            this.element.getGraphicItem().setAttributes(attributes.from);\n          }\n\n          const isCustomAnimate = isCustomAnimateCtor(customOption);\n          const isCustomInterpolator = !isNil(customOption) && !isCustomAnimateCtor(customOption);\n\n          if (isCustomInterpolator) {\n            return new CustomInterpolator(attributes.from, attributes.to, duration, effect.easing, {\n              interpolator: customOption as IAnimationChannelInterpolator,\n              element: this.element,\n              parameters: customParametersOption\n            });\n          } else if (isCustomAnimate) {\n            return new (customOption as IAnimationCustomConstructor)(\n              attributes.from,\n              attributes.to,\n              duration,\n              effect.easing,\n              customParametersOption\n            );\n          } else if (attributes.to) {\n            return new AttributeAnimate(attributes.from, attributes.to, duration, effect.easing);\n          }\n        })\n        .filter(animate => !isNil(animate));\n\n      if (customAnimates.length === 1) {\n        graphicAnimate.play(customAnimates[0]);\n      } else {\n        graphicAnimate.play(new AnimateGroup(duration, customAnimates));\n      }\n    }\n  }\n}\n"]}

package/es/graph/animation/arranger.d.ts

@@ -0,0 +1,13 @@
+import type { IAnimateArranger, IAnimator } from '../../types/animate';
+export declare class Arranger implements IAnimateArranger {
+    afterArranger: IAnimateArranger;
+    parallelArrangers: IAnimateArranger[];
+    animators: IAnimator[];
+    totalTime: number;
+    startTime: number;
+    endTime: number;
+    constructor(animators: IAnimator[]);
+    parallel(arranger: IAnimateArranger): this;
+    after(arranger: IAnimateArranger): this;
+    arrangeTime(): void;
+}

package/es/graph/animation/arranger.js

@@ -0,0 +1,29 @@
+import { isNil } from "@visactor/vutils";
+
+export class Arranger {
+    constructor(animators) {
+        this.parallelArrangers = [ this ], this.totalTime = 0, this.startTime = 0, this.endTime = 0, 
+        this.animators = animators.filter((animator => !isNil(animator))), this.totalTime = this.animators.reduce(((time, animator) => Math.max(time, animator.getTotalAnimationTime())), 0);
+    }
+    parallel(arranger) {
+        const parallelArrangers = Array.from(new Set(this.parallelArrangers.concat(arranger.parallelArrangers)));
+        return parallelArrangers.forEach((arranger => {
+            arranger.parallelArrangers = parallelArrangers;
+        })), this.arrangeTime(), this;
+    }
+    after(arranger) {
+        return this.afterArranger = arranger, this.arrangeTime(), this;
+    }
+    arrangeTime() {
+        const parallelTime = this.parallelArrangers.reduce(((time, arranger) => Math.max(time, arranger.totalTime)), this.totalTime), startTime = this.parallelArrangers.reduce(((time, arranger) => {
+            var _a, _b;
+            return Math.max(time, null !== (_b = null === (_a = arranger.afterArranger) || void 0 === _a ? void 0 : _a.endTime) && void 0 !== _b ? _b : 0);
+        }), 0);
+        this.parallelArrangers.forEach((arranger => {
+            arranger.startTime = startTime, arranger.endTime = startTime + parallelTime, arranger.animators.forEach((animator => {
+                animator.startAt(startTime);
+            }));
+        }));
+    }
+}
+//# sourceMappingURL=arranger.js.map

package/es/graph/animation/arranger.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/graph/animation/arranger.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGzC,MAAM,OAAO,QAAQ;IASnB,YAAY,SAAsB;QAPlC,sBAAiB,GAAuB,CAAC,IAAI,CAAC,CAAC;QAG/C,cAAS,GAAW,CAAC,CAAC;QACtB,cAAS,GAAW,CAAC,CAAC;QACtB,YAAO,GAAW,CAAC,CAAC;QAGlB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;QAChE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE;YACxD,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,QAAQ,CAAC,qBAAqB,EAAE,CAAC,CAAC;QAC1D,CAAC,EAAE,CAAC,CAAC,CAAC;IACR,CAAC;IAED,QAAQ,CAAC,QAA0B;QACjC,MAAM,iBAAiB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QACzG,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YACnC,QAAQ,CAAC,iBAAiB,GAAG,iBAAiB,CAAC;QACjD,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,KAAK,CAAC,QAA0B;QAC9B,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC;QAC9B,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,WAAW;QACT,MAAM,YAAY,GAAG,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE;YACpE,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;QAC5C,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;QACnB,MAAM,SAAS,GAAG,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE;;YACjE,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,MAAA,MAAA,QAAQ,CAAC,aAAa,0CAAE,OAAO,mCAAI,CAAC,CAAC,CAAC;QAC9D,CAAC,EAAE,CAAC,CAAC,CAAC;QAEN,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YACxC,QAAQ,CAAC,SAAS,GAAG,SAAS,CAAC;YAC/B,QAAQ,CAAC,OAAO,GAAG,SAAS,GAAG,YAAY,CAAC;YAC5C,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;gBACpC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;YAC9B,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;CACF","file":"arranger.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { IAnimateArranger, IAnimator } from '../../types/animate';\n\nexport class Arranger implements IAnimateArranger {\n  afterArranger: IAnimateArranger;\n  parallelArrangers: IAnimateArranger[] = [this];\n\n  animators: IAnimator[];\n  totalTime: number = 0;\n  startTime: number = 0;\n  endTime: number = 0;\n\n  constructor(animators: IAnimator[]) {\n    this.animators = animators.filter(animator => !isNil(animator));\n    this.totalTime = this.animators.reduce((time, animator) => {\n      return Math.max(time, animator.getTotalAnimationTime());\n    }, 0);\n  }\n\n  parallel(arranger: IAnimateArranger) {\n    const parallelArrangers = Array.from(new Set(this.parallelArrangers.concat(arranger.parallelArrangers)));\n    parallelArrangers.forEach(arranger => {\n      arranger.parallelArrangers = parallelArrangers;\n    });\n    this.arrangeTime();\n    return this;\n  }\n\n  after(arranger: IAnimateArranger) {\n    this.afterArranger = arranger;\n    this.arrangeTime();\n    return this;\n  }\n\n  arrangeTime() {\n    const parallelTime = this.parallelArrangers.reduce((time, arranger) => {\n      return Math.max(time, arranger.totalTime);\n    }, this.totalTime);\n    const startTime = this.parallelArrangers.reduce((time, arranger) => {\n      return Math.max(time, arranger.afterArranger?.endTime ?? 0);\n    }, 0);\n\n    this.parallelArrangers.forEach(arranger => {\n      arranger.startTime = startTime;\n      arranger.endTime = startTime + parallelTime;\n      arranger.animators.forEach(animator => {\n        animator.startAt(startTime);\n      });\n    });\n  }\n}\n"]}

package/es/graph/animation/attribute.d.ts

@@ -0,0 +1,27 @@
+import type { EasingType, IGraphic } from '@visactor/vrender';
+import { ACustomAnimate } from '@visactor/vrender';
+import type { IAnimationChannelInterpolator, IAnimationEffect, IAnimationParameters, IElement, IParsedAnimationAttrs } from '../../types';
+export declare function typeAnimationAttributes(element: IElement, effect: IAnimationEffect, animationParameters: IAnimationParameters, parameters: any): IParsedAnimationAttrs;
+export declare function channelAnimationAttributes(element: IElement, effect: IAnimationEffect, animationParameters: IAnimationParameters, parameters: any): IParsedAnimationAttrs;
+export declare class CustomInterpolator extends ACustomAnimate<any> {
+    private _element;
+    private _interpolator?;
+    constructor(from: any, to: any, duration: number, easing: EasingType, params: {
+        interpolator: IAnimationChannelInterpolator;
+        element: IElement;
+        parameters?: any;
+    });
+    onBind(): void;
+    getEndProps(): void | Record<string, any>;
+    onUpdate(end: boolean, ratio: number, out: Record<string, any>): void;
+}
+export declare class AttributeAnimate extends ACustomAnimate<any> {
+    target: IGraphic;
+    private _fromAttribute;
+    private _toAttribute;
+    getEndProps(): Record<string, any>;
+    onBind(): void;
+    onStart(): void;
+    onEnd(): void;
+    onUpdate(end: boolean, ratio: number, out: Record<string, any>): void;
+}

package/es/graph/animation/attribute.js

@@ -0,0 +1,114 @@
+import { ACustomAnimate, AttributeUpdateType } from "@visactor/vrender";
+
+import { isArray, isFunction, isNil, isObject, isValid } from "@visactor/vutils";
+
+import { isValidPointsChannel } from "../attributes/helpers";
+
+import { Factory } from "../../core/factory";
+
+const transformAnimationAttributes = (attributes, element) => {
+    if (!attributes) return null;
+    if (null == attributes ? void 0 : attributes.from) {
+        const from = attributes.from;
+        Object.keys(from).forEach((channel => {
+            isNil(from[channel]) && delete from[channel];
+        }));
+        const computePoints = isValidPointsChannel(Object.keys(from), element.mark.markType) && !isValid(from.segments);
+        if (computePoints) {
+            const items = element.items.map((item => Object.assign({}, item, {
+                nextAttrs: from
+            })));
+            attributes.from = element.transformElementItems(items, element.mark.markType, computePoints);
+        }
+    }
+    if (null == attributes ? void 0 : attributes.to) {
+        const to = attributes.to;
+        Object.keys(to).forEach((channel => {
+            isNil(to[channel]) && delete to[channel];
+        }));
+        const computePoints = isValidPointsChannel(Object.keys(to), element.mark.markType) && !isValid(to.segments);
+        if (computePoints) {
+            const items = element.items.map((item => Object.assign({}, item, {
+                nextAttrs: to
+            })));
+            attributes.to = element.transformElementItems(items, element.mark.markType, computePoints);
+        }
+    }
+    return attributes;
+};
+
+export function typeAnimationAttributes(element, effect, animationParameters, parameters) {
+    const options = isFunction(effect.options) ? effect.options.call(null, element.getDatum(), element, parameters) : effect.options;
+    if (!effect.type || !Factory.getAnimationType(effect.type)) return null;
+    const attributes = Factory.getAnimationType(effect.type)(element, options, animationParameters);
+    return transformAnimationAttributes(attributes, element);
+}
+
+const parseChannelValue = (element, channel, channelValue, animationParameters, parameters) => isFunction(channelValue) ? channelValue(element.getDatum(), element, parameters) : channelValue;
+
+export function channelAnimationAttributes(element, effect, animationParameters, parameters) {
+    const channel = effect.channel;
+    let attributes = null;
+    return isArray(channel) ? attributes = channel.reduce(((res, key) => (res.from[key] = element.getGraphicAttribute(key, !0), 
+    res.to[key] = element.getGraphicAttribute(key, !1), res)), {
+        from: {},
+        to: {}
+    }) : isObject(channel) && (attributes = Object.keys(channel).reduce(((res, key) => {
+        var _a, _b;
+        const hasFrom = !isNil(null === (_a = channel[key]) || void 0 === _a ? void 0 : _a.from), hasTo = !isNil(null === (_b = channel[key]) || void 0 === _b ? void 0 : _b.to);
+        return (hasFrom || hasTo) && (res.from[key] = hasFrom ? parseChannelValue(element, 0, channel[key].from, 0, parameters) : void 0, 
+        res.to[key] = hasTo ? parseChannelValue(element, 0, channel[key].to, 0, parameters) : element.getGraphicAttribute(key, !1)), 
+        res;
+    }), {
+        from: {},
+        to: {}
+    })), transformAnimationAttributes(attributes, element);
+}
+
+export class CustomInterpolator extends ACustomAnimate {
+    constructor(from, to, duration, easing, params) {
+        super(from, to, duration, easing, params), this._interpolator = null == params ? void 0 : params.interpolator, 
+        this._element = null == params ? void 0 : params.element;
+    }
+    onBind() {
+        var _a, _b;
+        this.from = null !== (_a = this.from) && void 0 !== _a ? _a : {}, this.to = null !== (_b = this.to) && void 0 !== _b ? _b : {};
+    }
+    getEndProps() {
+        return this.to;
+    }
+    onUpdate(end, ratio, out) {
+        this._interpolator && this._element && this._interpolator.call(this, ratio, this.from, this.to, out, this._element.getDatum(), this._element, this.params.parameters);
+    }
+}
+
+export class AttributeAnimate extends ACustomAnimate {
+    getEndProps() {
+        return this.to;
+    }
+    onBind() {
+        var _a, _b;
+        this.from = null !== (_a = this.from) && void 0 !== _a ? _a : {}, this.to = null !== (_b = this.to) && void 0 !== _b ? _b : {};
+    }
+    onStart() {
+        const from = Object.assign({}, this.from), to = Object.assign({}, this.to);
+        Object.keys(to).forEach((k => {
+            isNil(from[k]) && (from[k] = this.target.getComputedAttribute(k));
+        })), this.target.setAttributes(from, !1, {
+            type: AttributeUpdateType.ANIMATE_UPDATE,
+            animationState: {
+                ratio: 0,
+                end: !1
+            }
+        }), this._fromAttribute = from, this._toAttribute = to;
+    }
+    onEnd() {
+        this.target.setAttributes(this._toAttribute, !1, {
+            type: AttributeUpdateType.ANIMATE_END
+        });
+    }
+    onUpdate(end, ratio, out) {
+        this.target.stepInterpolate(this.subAnimate, this.subAnimate.animate, out, this.step, ratio, end, this._toAttribute, this._fromAttribute);
+    }
+}
+//# sourceMappingURL=attribute.js.map

package/es/graph/animation/attribute.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/graph/animation/attribute.ts"],"names":[],"mappings":"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","file":"attribute.js","sourcesContent":["import type { EasingType, IGraphic } from '@visactor/vrender';\n// eslint-disable-next-line no-duplicate-imports\nimport { ACustomAnimate, AttributeUpdateType } from '@visactor/vrender';\nimport { isArray, isFunction, isNil, isObject, isValid } from '@visactor/vutils';\nimport type {\n  IAnimationChannelInterpolator,\n  IAnimationEffect,\n  IAnimationParameters,\n  IElement,\n  IGlyphElement,\n  IParsedAnimationAttrs\n} from '../../types';\nimport { isValidPointsChannel } from '../attributes/helpers';\nimport { Factory } from '../../core/factory';\n\nconst transformAnimationAttributes = (attributes: IParsedAnimationAttrs, element: IElement): IParsedAnimationAttrs => {\n  if (!attributes) {\n    return null;\n  }\n\n  if (attributes?.from) {\n    const from = attributes.from;\n    Object.keys(from).forEach(channel => {\n      if (isNil(from[channel])) {\n        delete from[channel];\n      }\n    });\n    const computePoints = isValidPointsChannel(Object.keys(from), element.mark.markType) && !isValid(from.segments);\n    if (computePoints) {\n      const items = element.items.map(item => Object.assign({}, item, { nextAttrs: from }));\n      attributes.from = element.transformElementItems(items, element.mark.markType, computePoints);\n    }\n  }\n  if (attributes?.to) {\n    const to = attributes.to;\n    Object.keys(to).forEach(channel => {\n      if (isNil(to[channel])) {\n        delete to[channel];\n      }\n    });\n    const computePoints = isValidPointsChannel(Object.keys(to), element.mark.markType) && !isValid(to.segments);\n    if (computePoints) {\n      const items = element.items.map(item => Object.assign({}, item, { nextAttrs: to }));\n      attributes.to = element.transformElementItems(items, element.mark.markType, computePoints);\n    }\n  }\n\n  return attributes;\n};\n\nexport function typeAnimationAttributes(\n  element: IElement,\n  effect: IAnimationEffect,\n  animationParameters: IAnimationParameters,\n  parameters: any\n): IParsedAnimationAttrs {\n  // const parameters =\n  const options = isFunction(effect.options)\n    ? effect.options.call(null, element.getDatum(), element, parameters)\n    : effect.options;\n  if (!effect.type || !Factory.getAnimationType(effect.type)) {\n    return null;\n  }\n  const attributes = Factory.getAnimationType(effect.type)(element as IGlyphElement, options, animationParameters);\n  return transformAnimationAttributes(attributes, element);\n}\n\nconst parseChannelValue = (\n  element: IElement,\n  channel: string,\n  channelValue: any,\n  animationParameters: IAnimationParameters,\n  parameters: any\n) => {\n  return isFunction(channelValue) ? channelValue(element.getDatum(), element, parameters) : channelValue;\n};\n\nexport function channelAnimationAttributes(\n  element: IElement,\n  effect: IAnimationEffect,\n  animationParameters: IAnimationParameters,\n  parameters: any\n): IParsedAnimationAttrs {\n  const channel = effect.channel;\n  let attributes: IParsedAnimationAttrs = null;\n\n  if (isArray(channel)) {\n    attributes = channel.reduce(\n      (res, key) => {\n        res.from[key] = element.getGraphicAttribute(key, true);\n        res.to[key] = element.getGraphicAttribute(key, false);\n        return res;\n      },\n      { from: {}, to: {} }\n    );\n  } else if (isObject(channel)) {\n    attributes = Object.keys(channel).reduce(\n      (res, key) => {\n        const hasFrom = !isNil(channel[key]?.from);\n        const hasTo = !isNil(channel[key]?.to);\n\n        if (hasFrom || hasTo) {\n          res.from[key] = hasFrom\n            ? parseChannelValue(element, key, channel[key].from, animationParameters, parameters)\n            : undefined;\n          res.to[key] = hasTo\n            ? parseChannelValue(element, key, channel[key].to, animationParameters, parameters)\n            : element.getGraphicAttribute(key, false);\n        }\n\n        return res;\n      },\n      { from: {}, to: {} }\n    );\n  }\n\n  return transformAnimationAttributes(attributes, element);\n}\n\nexport class CustomInterpolator extends ACustomAnimate<any> {\n  private _element: IElement;\n  private _interpolator?: IAnimationChannelInterpolator;\n\n  constructor(\n    from: any,\n    to: any,\n    duration: number,\n    easing: EasingType,\n    params: { interpolator: IAnimationChannelInterpolator; element: IElement; parameters?: any }\n  ) {\n    super(from, to, duration, easing, params);\n    this._interpolator = params?.interpolator;\n    this._element = params?.element;\n  }\n\n  onBind() {\n    this.from = this.from ?? {};\n    this.to = this.to ?? {};\n  }\n\n  getEndProps(): void | Record<string, any> {\n    return this.to;\n  }\n\n  onUpdate(end: boolean, ratio: number, out: Record<string, any>): void {\n    if (!this._interpolator || !this._element) {\n      return;\n    }\n    this._interpolator.call(\n      this,\n      ratio,\n      this.from,\n      this.to,\n      out,\n      this._element.getDatum(),\n      this._element,\n      this.params.parameters\n    );\n  }\n}\n\nexport class AttributeAnimate extends ACustomAnimate<any> {\n  declare target: IGraphic;\n\n  private _fromAttribute: any;\n  private _toAttribute: any;\n\n  getEndProps(): Record<string, any> {\n    return this.to;\n  }\n\n  onBind() {\n    this.from = this.from ?? {};\n    this.to = this.to ?? {};\n  }\n\n  onStart(): void {\n    const from = Object.assign({}, this.from);\n    const to = Object.assign({}, this.to);\n    Object.keys(to).forEach(k => {\n      if (isNil(from[k])) {\n        from[k] = this.target.getComputedAttribute(k);\n      }\n      // if (this.to[k] === from[k]) {\n      //   delete from[k];\n      // }\n    });\n    this.target.setAttributes(from, false, {\n      type: AttributeUpdateType.ANIMATE_UPDATE,\n      animationState: { ratio: 0, end: false }\n    });\n\n    this._fromAttribute = from;\n    this._toAttribute = to;\n  }\n\n  onEnd(): void {\n    this.target.setAttributes(this._toAttribute, false, {\n      type: AttributeUpdateType.ANIMATE_END\n    });\n  }\n\n  onUpdate(end: boolean, ratio: number, out: Record<string, any>): void {\n    this.target.stepInterpolate(\n      this.subAnimate,\n      this.subAnimate.animate,\n      out,\n      this.step,\n      ratio,\n      end,\n      this._toAttribute,\n      this._fromAttribute\n    );\n  }\n}\n"]}

package/es/graph/animation/config.d.ts

@@ -0,0 +1,5 @@
+import type { IElement } from '../../types';
+import type { IAnimationConfig, IParsedAnimationConfig, MarkFunctionValueType } from '../../types/animate';
+export declare function normalizeAnimationConfig(config: Record<string, IAnimationConfig | IAnimationConfig[]>): Array<IParsedAnimationConfig>;
+export declare function normalizeStateAnimationConfig(state: string, config: IAnimationConfig | IAnimationConfig[], initialIndex?: number): Array<IParsedAnimationConfig>;
+export declare function invokeAnimateSpec<T>(spec: MarkFunctionValueType<T>, element: IElement, parameters: any): T;

package/es/graph/animation/config.js

@@ -0,0 +1,84 @@
+import { array, isFunction, isNil, merge } from "@visactor/vutils";
+
+import { DefaultAnimationControlOptions, DefaultAnimationDelay, DefaultAnimationDuration, DefaultAnimationEasing, DefaultAnimationLoop, DefaultAnimationOneByOne, DefaultAnimationStartTime } from "../constants";
+
+function transformToTimelineConfig(animationConfig) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    if (isNil(animationConfig.timeSlices)) {
+        const typeConfig = animationConfig;
+        return {
+            startTime: null !== (_a = typeConfig.startTime) && void 0 !== _a ? _a : DefaultAnimationStartTime,
+            totalTime: typeConfig.totalTime,
+            oneByOne: null !== (_b = typeConfig.oneByOne) && void 0 !== _b ? _b : DefaultAnimationOneByOne,
+            loop: null !== (_c = typeConfig.loop) && void 0 !== _c ? _c : DefaultAnimationLoop,
+            controlOptions: merge({}, DefaultAnimationControlOptions, null !== (_d = typeConfig.controlOptions) && void 0 !== _d ? _d : {}),
+            timeSlices: [ {
+                duration: null !== (_e = typeConfig.duration) && void 0 !== _e ? _e : DefaultAnimationDuration,
+                delay: null !== (_f = typeConfig.delay) && void 0 !== _f ? _f : DefaultAnimationDelay,
+                effects: [ {
+                    type: typeConfig.type,
+                    channel: typeConfig.channel,
+                    custom: typeConfig.custom,
+                    easing: null !== (_g = typeConfig.easing) && void 0 !== _g ? _g : DefaultAnimationEasing,
+                    customParameters: typeConfig.customParameters,
+                    options: typeConfig.options
+                } ]
+            } ]
+        };
+    }
+    const formattedTimeSlices = array(animationConfig.timeSlices).filter((timeSlice => timeSlice.effects && array(timeSlice.effects).filter((effect => effect.channel || effect.type)).length));
+    if (formattedTimeSlices.length) return {
+        startTime: null !== (_h = animationConfig.startTime) && void 0 !== _h ? _h : DefaultAnimationStartTime,
+        totalTime: animationConfig.totalTime,
+        oneByOne: null !== (_j = animationConfig.oneByOne) && void 0 !== _j ? _j : DefaultAnimationOneByOne,
+        loop: null !== (_k = animationConfig.loop) && void 0 !== _k ? _k : DefaultAnimationLoop,
+        controlOptions: merge({}, DefaultAnimationControlOptions, null !== (_l = animationConfig.controlOptions) && void 0 !== _l ? _l : {}),
+        timeSlices: formattedTimeSlices.map((timeSlice => {
+            var _a;
+            return {
+                duration: timeSlice.duration,
+                delay: null !== (_a = timeSlice.delay) && void 0 !== _a ? _a : DefaultAnimationDelay,
+                effects: array(timeSlice.effects).filter((effect => effect.channel || effect.type)).map((effect => {
+                    var _a;
+                    return {
+                        type: effect.type,
+                        channel: effect.channel,
+                        custom: effect.custom,
+                        easing: null !== (_a = effect.easing) && void 0 !== _a ? _a : DefaultAnimationEasing,
+                        customParameters: effect.customParameters,
+                        options: effect.options
+                    };
+                }))
+            };
+        })),
+        partitioner: animationConfig.partitioner,
+        sort: animationConfig.sort
+    };
+}
+
+export function normalizeAnimationConfig(config) {
+    let normalizedConfig = [];
+    return Object.keys(config).forEach((state => {
+        normalizedConfig = normalizedConfig.concat(normalizeStateAnimationConfig(state, config[state]));
+    })), normalizedConfig;
+}
+
+export function normalizeStateAnimationConfig(state, config, initialIndex = 0) {
+    const normalizedConfig = [];
+    let index = initialIndex;
+    return array(config).forEach((animationConfig => {
+        var _a;
+        const timelineConfig = transformToTimelineConfig(animationConfig);
+        timelineConfig && (normalizedConfig.push({
+            state: state,
+            id: null !== (_a = timelineConfig.id) && void 0 !== _a ? _a : `${state}-${index}`,
+            timeline: timelineConfig,
+            originConfig: animationConfig
+        }), index += 1);
+    })), normalizedConfig;
+}
+
+export function invokeAnimateSpec(spec, element, parameters) {
+    return isFunction(spec) ? spec.call(null, element.getDatum(), element, parameters) : spec;
+}
+//# sourceMappingURL=config.js.map

package/es/graph/animation/config.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/graph/animation/config.ts"],"names":[],"mappings":"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","file":"config.js","sourcesContent":["import { array, isFunction, isNil, merge } from '@visactor/vutils';\nimport type { IElement } from '../../types';\nimport type {\n  IAnimationConfig,\n  IAnimationTimeline,\n  IAnimationTypeConfig,\n  IParsedAnimationConfig,\n  MarkFunctionValueType\n} from '../../types/animate';\nimport {\n  DefaultAnimationControlOptions,\n  DefaultAnimationDelay,\n  DefaultAnimationDuration,\n  DefaultAnimationEasing,\n  DefaultAnimationLoop,\n  DefaultAnimationOneByOne,\n  DefaultAnimationStartTime\n} from '../constants';\n\nfunction transformToTimelineConfig(animationConfig: IAnimationConfig): IAnimationTimeline {\n  if (isNil((animationConfig as IAnimationTimeline).timeSlices)) {\n    const typeConfig = animationConfig as IAnimationTypeConfig;\n    // transform type animation config into timeline animation config\n    return {\n      startTime: typeConfig.startTime ?? DefaultAnimationStartTime,\n      totalTime: typeConfig.totalTime,\n      oneByOne: typeConfig.oneByOne ?? DefaultAnimationOneByOne,\n      loop: typeConfig.loop ?? DefaultAnimationLoop,\n      controlOptions: merge({}, DefaultAnimationControlOptions, typeConfig.controlOptions ?? {}),\n      timeSlices: [\n        {\n          duration: typeConfig.duration ?? DefaultAnimationDuration,\n          delay: typeConfig.delay ?? DefaultAnimationDelay,\n          effects: [\n            {\n              type: typeConfig.type,\n              channel: typeConfig.channel,\n              custom: typeConfig.custom,\n              easing: typeConfig.easing ?? DefaultAnimationEasing,\n              customParameters: typeConfig.customParameters,\n              options: typeConfig.options\n            }\n          ]\n        }\n      ]\n    };\n  }\n\n  const timeSlices = array((animationConfig as IAnimationTimeline).timeSlices);\n  const formattedTimeSlices = timeSlices.filter(timeSlice => {\n    return timeSlice.effects && array(timeSlice.effects).filter(effect => effect.channel || effect.type).length;\n  });\n\n  if (formattedTimeSlices.length) {\n    // fill up default animation config\n    return {\n      startTime: (animationConfig as IAnimationTimeline).startTime ?? DefaultAnimationStartTime,\n      totalTime: (animationConfig as IAnimationTimeline).totalTime,\n      oneByOne: (animationConfig as IAnimationTimeline).oneByOne ?? DefaultAnimationOneByOne,\n      loop: (animationConfig as IAnimationTimeline).loop ?? DefaultAnimationLoop,\n      controlOptions: merge({}, DefaultAnimationControlOptions, animationConfig.controlOptions ?? {}),\n      timeSlices: formattedTimeSlices.map(timeSlice => {\n        return {\n          duration: timeSlice.duration,\n          delay: timeSlice.delay ?? DefaultAnimationDelay,\n          effects: array(timeSlice.effects)\n            .filter(effect => effect.channel || effect.type)\n            .map(effect => {\n              return {\n                type: effect.type,\n                channel: effect.channel,\n                custom: effect.custom,\n                easing: effect.easing ?? DefaultAnimationEasing,\n                customParameters: effect.customParameters,\n                options: effect.options\n              };\n            })\n        };\n      }),\n      partitioner: (animationConfig as IAnimationTimeline).partitioner,\n      sort: (animationConfig as IAnimationTimeline).sort\n    };\n  }\n\n  return;\n}\n\nexport function normalizeAnimationConfig(\n  config: Record<string, IAnimationConfig | IAnimationConfig[]>\n): Array<IParsedAnimationConfig> {\n  let normalizedConfig: Array<IParsedAnimationConfig> = [];\n\n  Object.keys(config).forEach(state => {\n    normalizedConfig = normalizedConfig.concat(normalizeStateAnimationConfig(state, config[state]));\n  });\n  return normalizedConfig;\n}\n\nexport function normalizeStateAnimationConfig(\n  state: string,\n  config: IAnimationConfig | IAnimationConfig[],\n  initialIndex: number = 0\n): Array<IParsedAnimationConfig> {\n  const normalizedConfig: Array<IParsedAnimationConfig> = [];\n  let index = initialIndex;\n  array(config).forEach(animationConfig => {\n    const timelineConfig = transformToTimelineConfig(animationConfig);\n    if (timelineConfig) {\n      normalizedConfig.push({\n        state,\n        id: timelineConfig.id ?? `${state}-${index}`,\n        timeline: timelineConfig,\n        originConfig: animationConfig\n      });\n      index += 1;\n    }\n  });\n  return normalizedConfig;\n}\n\nexport function invokeAnimateSpec<T>(spec: MarkFunctionValueType<T>, element: IElement, parameters: any): T {\n  if (isFunction(spec)) {\n    return spec.call(null, element.getDatum(), element, parameters);\n  }\n  return spec;\n}\n"]}

package/es/graph/animation/morph.d.ts

@@ -0,0 +1,12 @@
+import type { IGrammarBase, IMark, IRunningConfig } from '../../types';
+import type { DiffResult } from '../../types/base';
+import type { IMorph } from '../../types/morph';
+export declare class Morph implements IMorph {
+    diffGrammar<U extends IGrammarBase>(prevGrammars: U[], nextGrammars: U[]): DiffResult<U, U>;
+    diffMark(prevMarks: IMark[], nextMarks: IMark[], runningConfig: IRunningConfig): DiffResult<IMark[], IMark[]>;
+    private _appendMorphKeyToElements;
+    morph(prevMarks: IMark[], nextMarks: IMark[], runningConfig: IRunningConfig): void;
+    private diffUpdateByGroup;
+    private doMorph;
+    private divideElements;
+}

package/es/graph/animation/morph.js

@@ -0,0 +1,171 @@
+import { morphPath, multiToOneMorph, oneToMultiMorph } from "@visactor/vrender";
+
+import { isNil, isNumber, isValidNumber } from "@visactor/vutils";
+
+import { invokeFunctionType, parseField } from "../../parse/util";
+
+import { diffMultiple, diffSingle, groupData } from "../mark/differ";
+
+import { GrammarMarkType } from "../enums";
+
+const EmptyKey = Symbol.for("key");
+
+export class Morph {
+    diffGrammar(prevGrammars, nextGrammars) {
+        return diffSingle(prevGrammars, nextGrammars, (grammar => {
+            var _a;
+            return null !== (_a = grammar.id()) && void 0 !== _a ? _a : Symbol();
+        }));
+    }
+    diffMark(prevMarks, nextMarks, runningConfig) {
+        const diffResult = {
+            enter: [],
+            exit: [],
+            update: []
+        };
+        let prevDiffMarks = [], nextDiffMarks = [];
+        prevMarks.forEach((mark => {
+            mark.markType !== GrammarMarkType.group && (runningConfig.morph && mark.getMorphConfig().morph || runningConfig.morphAll || runningConfig.reuse) ? prevDiffMarks.push(mark) : diffResult.exit.push({
+                prev: [ mark ]
+            });
+        })), nextMarks.forEach((mark => {
+            mark.markType !== GrammarMarkType.group && (runningConfig.morph && mark.getMorphConfig().morph || runningConfig.morphAll || runningConfig.reuse) ? nextDiffMarks.push(mark) : diffResult.enter.push({
+                next: [ mark ]
+            });
+        }));
+        const keyDiffResult = this.diffUpdateByGroup(prevDiffMarks, nextDiffMarks, (mark => mark.getMorphConfig().morphKey), (mark => mark.getMorphConfig().morphKey));
+        prevDiffMarks = keyDiffResult.prev, nextDiffMarks = keyDiffResult.next, diffResult.update = diffResult.update.concat(keyDiffResult.update);
+        const nameDiffResult = this.diffUpdateByGroup(prevDiffMarks, nextDiffMarks, (mark => mark.id()), (mark => mark.id()));
+        prevDiffMarks = nameDiffResult.prev, nextDiffMarks = nameDiffResult.next, diffResult.update = diffResult.update.concat(nameDiffResult.update);
+        const prevParentGroup = groupData(prevDiffMarks, (mark => {
+            var _a, _b;
+            return null === (_b = null === (_a = mark.group) || void 0 === _a ? void 0 : _a.id) || void 0 === _b ? void 0 : _b.call(_a);
+        })), nextParentGroup = groupData(nextDiffMarks, (mark => {
+            var _a, _b;
+            return null === (_b = null === (_a = mark.group) || void 0 === _a ? void 0 : _a.id) || void 0 === _b ? void 0 : _b.call(_a);
+        }));
+        return Object.keys(nextParentGroup).forEach((groupName => {
+            const prevChildren = prevParentGroup.data.get(groupName), nextChildren = nextParentGroup.data.get(groupName);
+            if (prevChildren && nextChildren) {
+                for (let i = 0; i < Math.max(prevChildren.length, nextChildren.length); i += 1) {
+                    const prevChild = prevChildren[i], nextChild = nextChildren[i];
+                    prevChild && nextChild ? diffResult.update.push({
+                        prev: [ prevChild ],
+                        next: [ nextChild ]
+                    }) : prevChild ? diffResult.exit.push({
+                        prev: [ prevChild ]
+                    }) : nextChild && diffResult.enter.push({
+                        next: [ nextChild ]
+                    });
+                }
+                prevDiffMarks = prevDiffMarks.filter((mark => !prevChildren.includes(mark))), nextDiffMarks = nextDiffMarks.filter((mark => !nextChildren.includes(mark)));
+            }
+        })), prevDiffMarks.forEach((mark => diffResult.exit.push({
+            prev: [ mark ]
+        }))), nextDiffMarks.forEach((mark => diffResult.enter.push({
+            next: [ mark ]
+        }))), diffResult;
+    }
+    _appendMorphKeyToElements(mark) {
+        const config = mark.getMorphConfig();
+        if (!isNil(config.morphElementKey)) {
+            const getter = parseField(config.morphElementKey);
+            mark.elements && mark.elements.forEach((el => {
+                el.morphKey = getter(el.getDatum());
+            }));
+        }
+    }
+    morph(prevMarks, nextMarks, runningConfig) {
+        const prevElements = prevMarks.reduce(((elements, mark) => (this._appendMorphKeyToElements(mark), 
+        elements.concat(mark.elements))), []), nextElements = nextMarks.reduce(((elements, mark) => (this._appendMorphKeyToElements(mark), 
+        elements.concat(mark.elements))), []), diffResult = diffMultiple(prevElements, nextElements, (element => {
+            var _a;
+            return null !== (_a = element.morphKey) && void 0 !== _a ? _a : element.key;
+        }));
+        prevMarks.forEach((mark => {
+            var _a, _b;
+            return null === (_b = null === (_a = mark.animate) || void 0 === _a ? void 0 : _a.disable) || void 0 === _b ? void 0 : _b.call(_a);
+        })), nextMarks.forEach((mark => {
+            var _a, _b;
+            return null === (_b = null === (_a = mark.animate) || void 0 === _a ? void 0 : _a.disable) || void 0 === _b ? void 0 : _b.call(_a);
+        }));
+        const parameters = prevMarks.concat(nextMarks).reduce(((parameters, mark) => (Object.assign(parameters, mark.parameters()), 
+        parameters)), {});
+        let morphCount = 0;
+        const onMorphEnd = () => {
+            morphCount -= 1, 0 === morphCount && nextMarks.forEach((mark => {
+                var _a, _b;
+                null === (_b = null === (_a = mark.animate) || void 0 === _a ? void 0 : _a.enable) || void 0 === _b || _b.call(_a);
+            }));
+        };
+        diffResult.enter.forEach((diff => {
+            diff.next.forEach((element => {
+                this.doMorph([], [ element ], runningConfig, onMorphEnd, parameters);
+            })), morphCount += 1;
+        })), diffResult.update.forEach((diff => {
+            const divideCount = Math.min(diff.prev.length, diff.next.length), prevDivide = this.divideElements(diff.prev, divideCount), nextDivide = this.divideElements(diff.next, divideCount);
+            for (let i = 0; i < divideCount; i++) this.doMorph(prevDivide[i], nextDivide[i], runningConfig, onMorphEnd, parameters), 
+            morphCount += 1;
+        }));
+    }
+    diffUpdateByGroup(prev, next, prevKey, nextKey) {
+        const prevGroup = groupData(prev, (datum => {
+            var _a;
+            return null !== (_a = prevKey(datum)) && void 0 !== _a ? _a : EmptyKey;
+        })), nextGroup = groupData(next, (datum => {
+            var _a;
+            return null !== (_a = nextKey(datum)) && void 0 !== _a ? _a : EmptyKey;
+        }));
+        let prevAfterDiff = prev, nextAfterDiff = next;
+        const update = [];
+        return nextGroup.keys.forEach((key => {
+            if (key !== EmptyKey) {
+                const prevKeyData = prevGroup.data.get(key), nextKeyData = nextGroup.data.get(key);
+                prevKeyData && nextKeyData && (update.push({
+                    prev: prevKeyData,
+                    next: nextKeyData
+                }), prevAfterDiff = prevAfterDiff.filter((datum => !prevKeyData.includes(datum))), 
+                nextAfterDiff = nextAfterDiff.filter((datum => !nextKeyData.includes(datum))));
+            }
+        })), {
+            prev: prevAfterDiff,
+            next: nextAfterDiff,
+            update: update
+        };
+    }
+    doMorph(prev, next, runningConfig, onEnd, parameters) {
+        var _a, _b;
+        const morphData = {
+            prev: prev.map((element => element.getDatum())),
+            next: next.map((element => element.getDatum()))
+        }, morphElements = {
+            prev: prev.slice(),
+            next: next.slice()
+        }, easing = runningConfig.animation.easing, delay = invokeFunctionType(runningConfig.animation.delay, parameters, morphData, morphElements), duration = invokeFunctionType(runningConfig.animation.duration, parameters, morphData, morphElements), oneByOne = invokeFunctionType(runningConfig.animation.oneByOne, parameters, morphData, morphElements), splitPath = invokeFunctionType(runningConfig.animation.splitPath, parameters, morphData, morphElements), individualDelay = isValidNumber(oneByOne) && oneByOne > 0 ? index => isNumber(oneByOne) ? index * oneByOne : !0 === oneByOne ? index * duration : 0 : void 0;
+        1 !== prev.length && 0 !== prev.length || 1 !== next.length ? 1 === prev.length && next.length > 1 ? oneToMultiMorph(prev[0].getGraphicItem(), next.map((element => element.getGraphicItem())), {
+            delay: delay,
+            duration: duration,
+            easing: easing,
+            onEnd: onEnd,
+            individualDelay: individualDelay,
+            splitPath: splitPath
+        }) : prev.length > 1 && 1 === next.length && multiToOneMorph(prev.map((element => element.getGraphicItem())), next[0].getGraphicItem(), {
+            delay: delay,
+            duration: duration,
+            easing: easing,
+            onEnd: onEnd,
+            individualDelay: individualDelay,
+            splitPath: splitPath
+        }) : morphPath(null === (_b = null === (_a = prev[0]) || void 0 === _a ? void 0 : _a.getGraphicItem) || void 0 === _b ? void 0 : _b.call(_a), next[0].getGraphicItem(), {
+            delay: delay,
+            duration: duration,
+            easing: easing,
+            onEnd: onEnd
+        });
+    }
+    divideElements(elements, count) {
+        const divideLength = Math.floor(elements.length / count);
+        return new Array(count).fill(0).map(((i, index) => elements.slice(divideLength * index, index === count - 1 ? elements.length : divideLength * (index + 1))));
+    }
+}
+//# sourceMappingURL=morph.js.map