@visactor/vrender-animate/es/custom/growPoints.js

This module provides a graph-based animation system for VRender.

import { pointInterpolation } from "@visactor/vrender-core";

import { isValidNumber } from "@visactor/vutils";

import { ACustomAnimate } from "./custom-animate";

import { applyAnimationFrameAttributes, applyAppearStartAttributes } from "./transient";

const getCenterPoints = (graphic, options, animationParameters) => {
    const points = graphic.getFinalAttribute().points, center = {
        x: 0,
        y: 0
    };
    return points.forEach((point => {
        center.x += point.x, center.y += point.y;
    })), center.x /= points.length, center.y /= points.length, options && options.center && (isValidNumber(options.center.x) && (center.x = options.center.x), 
    isValidNumber(options.center.y) && (center.y = options.center.y)), "area" === graphic.type && (center.x1 = center.x, 
    center.y1 = center.y), points.map((point => Object.assign({}, point, center)));
};

export const growPointsIn = (graphic, options, animationParameters) => {
    const attrs = graphic.getFinalAttribute();
    return {
        from: {
            points: getCenterPoints(graphic, options)
        },
        to: {
            points: attrs.points
        }
    };
};

export const growPointsOut = (graphic, options, animationParameters) => ({
    from: {
        points: graphic.getFinalAttribute().points
    },
    to: {
        points: getCenterPoints(graphic, options)
    }
});

export class GworPointsBase extends ACustomAnimate {
    constructor(from, to, duration, easing, params) {
        super(from, to, duration, easing, params);
    }
    onUpdate(end, ratio, out) {
        var _a, _b;
        const fromPoints = null === (_a = this.from) || void 0 === _a ? void 0 : _a.points, toPoints = null === (_b = this.to) || void 0 === _b ? void 0 : _b.points;
        fromPoints && toPoints && (applyAnimationFrameAttributes(this.target, {
            points: fromPoints.map(((point, index) => pointInterpolation(fromPoints[index], toPoints[index], ratio)))
        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag());
    }
}

export class GrowPointsIn extends GworPointsBase {
    onBind() {
        var _a;
        if (super.onBind(), [ "area", "line", "polygon" ].includes(this.target.type)) {
            const {from: from, to: to} = growPointsIn(this.target, this.params.options, this.params);
            this.props = to, this.propKeys = Object.keys(to).filter((key => null != to[key])), 
            this.from = from, this.to = to, this.target.applyFinalAttributeToAttribute(), !1 !== (null === (_a = this.params.controlOptions) || void 0 === _a ? void 0 : _a.immediatelyApply) && applyAppearStartAttributes(this.target, from);
        } else this.valid = !1;
    }
}

export class GrowPointsOut extends GworPointsBase {
    onBind() {
        if (super.onBind(), [ "area", "line" ].includes(this.target.type)) {
            const attrs = this.target.getFinalAttribute(), {from: from, to: to} = (graphic = this.target, 
            options = this.params.options, this.params, {
                from: {
                    points: graphic.getFinalAttribute().points
                },
                to: {
                    points: getCenterPoints(graphic, options)
                }
            });
            this.props = to, this.propKeys = Object.keys(to).filter((key => null != to[key])), 
            this.from = from || attrs, this.to = to;
        } else this.valid = !1;
        var graphic, options;
    }
}

const changePointsX = (graphic, options, animationParameters) => graphic.getFinalAttribute().points.map((point => {
    if (options && "negative" === options.orient) {
        let groupRight = graphic.stage.viewWidth;
        return graphic.parent.parent.parent && (groupRight = graphic.parent.parent.parent.AABBBounds.width()), 
        Object.assign(Object.assign({}, point), {
            x: groupRight,
            y: point.y,
            x1: groupRight,
            y1: point.y1,
            defined: !1 !== point.defined
        });
    }
    return Object.assign(Object.assign({}, point), {
        x: 0,
        y: point.y,
        x1: 0,
        y1: point.y1,
        defined: !1 !== point.defined
    });
})), growPointsXIn = (graphic, options, animationParameters) => {
    const attrs = graphic.getFinalAttribute();
    return {
        from: {
            points: changePointsX(graphic, options)
        },
        to: {
            points: attrs.points
        }
    };
}, growPointsXOut = (graphic, options, animationParameters) => ({
    from: {
        points: graphic.getFinalAttribute().points
    },
    to: {
        points: changePointsX(graphic, options)
    }
});

export class GrowPointsXIn extends GworPointsBase {
    onBind() {
        var _a;
        if (super.onBind(), [ "area", "line", "polygon" ].includes(this.target.type)) {
            const {from: from, to: to} = growPointsXIn(this.target, this.params.options, this.params);
            this.props = to, this.propKeys = Object.keys(to).filter((key => null != to[key])), 
            this.from = from, this.to = to, this.target.applyFinalAttributeToAttribute(), !1 !== (null === (_a = this.params.controlOptions) || void 0 === _a ? void 0 : _a.immediatelyApply) && applyAppearStartAttributes(this.target, from);
        } else this.valid = !1;
    }
}

export class GrowPointsXOut extends GworPointsBase {
    onBind() {
        if (super.onBind(), [ "area", "line" ].includes(this.target.type)) {
            const attrs = this.target.getFinalAttribute(), {from: from, to: to} = (graphic = this.target, 
            options = this.params.options, this.params, {
                from: {
                    points: graphic.getFinalAttribute().points
                },
                to: {
                    points: changePointsX(graphic, options)
                }
            });
            this.props = to, this.propKeys = Object.keys(to).filter((key => null != to[key])), 
            this.from = from || attrs, this.to = to;
        } else this.valid = !1;
        var graphic, options;
    }
}

const changePointsY = (graphic, options, animationParameters) => graphic.getFinalAttribute().points.map((point => {
    if (options && "negative" === options.orient) {
        let groupBottom = graphic.stage.viewHeight;
        return graphic.parent.parent.parent && (groupBottom = graphic.parent.parent.parent.AABBBounds.height()), 
        Object.assign(Object.assign({}, point), {
            x: point.x,
            y: groupBottom,
            x1: point.x1,
            y1: groupBottom,
            defined: !1 !== point.defined
        });
    }
    return Object.assign(Object.assign({}, point), {
        x: point.x,
        y: 0,
        x1: point.x1,
        y1: 0,
        defined: !1 !== point.defined
    });
})), growPointsYIn = (graphic, options, animationParameters) => {
    const attrs = graphic.getFinalAttribute();
    return {
        from: {
            points: changePointsY(graphic, options)
        },
        to: {
            points: attrs.points
        }
    };
}, growPointsYOut = (graphic, options, animationParameters) => ({
    from: {
        points: graphic.getFinalAttribute().points
    },
    to: {
        points: changePointsY(graphic, options)
    }
});

export class GrowPointsYIn extends GworPointsBase {
    onBind() {
        var _a;
        if (super.onBind(), [ "area", "line", "polygon" ].includes(this.target.type)) {
            const {from: from, to: to} = growPointsYIn(this.target, this.params.options, this.params);
            this.props = to, this.propKeys = Object.keys(to).filter((key => null != to[key])), 
            this.from = from, this.to = to, this.target.applyFinalAttributeToAttribute(), !1 !== (null === (_a = this.params.controlOptions) || void 0 === _a ? void 0 : _a.immediatelyApply) && applyAppearStartAttributes(this.target, from);
        } else this.valid = !1;
    }
}

export class GrowPointsYOut extends GworPointsBase {
    onBind() {
        if (super.onBind(), [ "area", "line", "polygon" ].includes(this.target.type)) {
            const {from: from, to: to} = (graphic = this.target, options = this.params.options, 
            this.params, {
                from: {
                    points: graphic.getFinalAttribute().points
                },
                to: {
                    points: changePointsY(graphic, options)
                }
            });
            this.props = to, this.propKeys = Object.keys(to).filter((key => null != to[key])), 
            this.from = null != from ? from : this.target.attribute, this.to = to;
        } else this.valid = !1;
        var graphic, options;
    }
}
//# sourceMappingURL=growPoints.js.map