javascript - 使用 svg.js 动画位置的正确方法是什么

Question

我创建了一条路径（渲染良好）。几秒钟后，我只想让它垂直向上移动。

按照文档，我已经能够为路径设置动画，但它并没有像我预期的那样移动。路径向右跳并沿对角线移动，与平滑的垂直过渡相反。这是我的代码：

    hero = draw.path(pHero).center(310,200).animate(2000, '>', 1000).center(310,100);

谁能指出造成这种情况的原因？

我也在 JSFiddle 中对此进行了概述：http: //jsfiddle.net/Dwf3Z/

Answer 1

路径本身通常会产生偏移，从而产生有偏见的翻译。最简单的方法是将路径放在一个组中。

hero = draw.group()
hero.path(pHero)
hero.center(310,200).animate(2000, '>', 1000).center(310,100)

这是您的小提琴的修改版本：http: //jsfiddle.net/Dwf3Z/1/