#独家

svg.js如何实现一边移动一边旋转的动画？

svg.js如何实现一边移动一边旋转的动画？就像行驶的车轮一样。
我做了一个demo，但是没有达到预期的效果

补充说明：是一边移动一边旋转，速度是不一样的，就像行驶的汽车，驾驶两百米，车轮转好多圈

svgRect.animate(200, 0, 'absolute').ease('-').transform({ rotate: 360 }, true).loop()
svgRect.animate(10000, 0, 'now').transform({ translate: [x, y]}, true)

这下带你起飞。。。

这个东西我不熟，我看了下。dmove应该是作用元素的XY坐标所以会环绕。

svgRect.animate(5000, 0, 'now').transform({ rotate: 360 ,translateX:200,translateY:200}, true);

就好了。

translate属性都是我猜的。。

旋转加移动

var rect = SVG('drawing').rect(100, 100)

// 移动动画
rect.animate(5000, '<>').move(500, 500)

// 旋转动画
rect.animate({ duration: 3000, ease: '<>', delay: 0 }).rotate(360).loop()