设置元素动画与使用attr（）方法处理元素非常相似。唯一的区别是必须包含animate（）方法。
Animate()
rect.animate().move(150, 150)
animate（）方法将接受三个参数。第一个是持续时间（duration），第二个是延迟（delay），第三个是何时（when）：
rect.animate(2000, 1000, 'now').attr({
fill: '#f03' })
或者，您可以传递一个对象作为第一个参数，它接受更多的参数：
rect.animate({
duration: 2000,
delay: 1000,
when: 'now',
swing: true,
times: 5,
wait: 200
}).attr({
fill: '#f03' })
默认情况下，持续时间(duration)将设置为400，延迟(delay)将设置为0，时间(when)设置为after。
when参数指定动画的起点。它可以具有以下值：
- now: 在执行此调用后立即播放动画
- absolute or start: 安排动画在时间轴上的绝对时间运行
- relative: 安排动画相对于其旧的开始时间播放（对于animate（）-调用不有用）
- last or after: 在时间轴上最后一个动画之后播放动画。如果没有，则立即播放动画（请参见）
通过再次调用animate，可以将多个动画链接在一起：
rect.animate().attr({
fill: '#f03' }).animate().dmove(50,50)
还可以在动画之间添加延迟：
rect.animate().attr({
fill: '#f03' }).delay(200).animate().dmove(50,50)
当然，这也可以通过向第二次动画添加延迟来完成：
rect.animate().attr({
fill: '#f03' }).animate({
delay: 200}).dmove(50,50)
SVG.Runner
animate（）方法不会返回目标元素，而是返回SVG的一个实例。Runner具有与任何元素相同的方法和控制运行器的其他方法：
let rect = draw.rect(100, 100)
let runner = rect.animate()
runner.element() // 返回或设置runner绑定到的元素
runner.timeline() // 返回或设置runner计划的时间线
runner.animate() // 用于动画链接。请参见element.animate（）
runner.schedule(timeline, delay, when) // 在timeline上安排runner。如果已设置timeline，则可以跳过
runner.unschedule() // 从timeline中删除runner
runner.loop(times, swing, wait) // 将动画循环“times”次，每次循环之间的时间为“wait”毫秒
runner.queue(runOnceFn, runOnEveryStepFn) // 允许您链接非必要动画的函数
runner.during(fn) // 用于将函数绑定到每个动画步骤
runner.after(fn) // 用于绑定动画完成后执行的函数
runner.time() // 返回或设置runner时间
runner.duration() // 返回runner运行的持续时间
runner.loops() // 让您跳转到runner的特定迭代，例如第4个循环中途的3.5
runner.persist() // 让这位runner永远（真）或在特定时间内坚持在时间线上。通常在执行后删除运行程序以清理内存。
runner.position() // 返回或设置runner的当前位置，忽略等待时间（介于0和1之间）
runner.progress() // 返回或设置runner的当前位置，包括等待时间（介于0和1之间）
runner.step(dt) // 按一定时间步进runner（用于手动步进槽动画）
runner.reset() // 将runner设置回零时间，并使用它设置所有动画
runner.finish() // 使runner逐步进入完成状态
runner.reverse() // 向后执行runner
runner.ease() // 更改动画的缓和程度
runner.active() // 返回或设置runner的活动状态。不执行非活动runner
runner通常通过调用animate来创建。但是，可以在没有元素的情况下创建runner，然后再设置元素：
var runner = new SVG.Runner(1000)
runner.move(100, 100)
runner.element(someElement)
// Step animation by 20ms
runner.step(20)
// To animate, we need a timeline on which the runner is run
var timeline = new SVG.Timeline()
timeline.schedule(runner)