RaphaelJS - 在动画时查找路径中的点

发布于 2024-10-07 20:36:29 字数 334 浏览 9 评论 0原文

假设我有一个椭圆 e，我想沿着路径 p 设置动画。

如果我开始为椭圆设置动画，但后来决定停止动画，有什么方法可以从当前点重新启动动画吗？我无法找到一种方法来确定停止动画后椭圆沿路径的当前点。

这是我的动画代码（均为标准）：

e.attr({ rx: 15, ry: 5 }).animateAlong(p, 15000, true, function () {
                    e.attr({ rx: 10, ry: 10 });
                    clicked = false;
                });

原文

Let's say I have an ellipse e that I wanted to animate along path p.

If I began to animate the ellipse, but then decided to stop the animation, is there any way I could restart the animation from it's current point? I haven't been able to find a way to determine the ellipse's current point along a path after stopping the animation.

Here is my animation code (all standard):

e.attr({ rx: 15, ry: 5 }).animateAlong(p, 15000, true, function () {
                    e.attr({ rx: 10, ry: 10 });
                    clicked = false;
                });

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

骄傲 2024-10-14 20:36:29

使用 onAnimate 定义外部的最后一点怎么样？

var lastX = 15, lastY = 5;
e.onAnimation(function() {
    lastX = e.attr('rx');
    lastY = e.attr('ry');
});

e.attr({ rx: lastX, ry: lastY }).animateAlong(p, 15000, true, function () {
    e.attr({ rx: 10, ry: 10 });
    clicked = false;
});

因此，如果您在函数或其他内部多次运行此代码，椭圆将不会从 15、5 开始，而是从动画的最后一个点开始（在被中断之前）。

这就是你的意思？

How about you define the last points outside using onAnimate?

var lastX = 15, lastY = 5;
e.onAnimation(function() {
    lastX = e.attr('rx');
    lastY = e.attr('ry');
});

e.attr({ rx: lastX, ry: lastY }).animateAlong(p, 15000, true, function () {
    e.attr({ rx: 10, ry: 10 });
    clicked = false;
});

So if you run this code several times, inside a function or whatever, you ellipse will start not at 15, 5 but at the last point in the animation (before it was interrupted).

This what you meant?

回复收藏 0 原文

~没有更多了~