Raphael JS清掃時鐘

Question

使用Raphael JS我想要持續清掃時鐘。

我有種得到它的實施，但有一個問題。

動畫的變換不斷需要一個增加的整數來旋轉。最終我會打一個最大整數。

如果我使用0,90,180,270。當它再次達到0時，它會以另一種方式返回。

CodePen - > http://codepen.io/ianw92/pen/yNLdZz

的Javascript：

var svg = Raphael("container",400,400), 
    triangle = svg.path("M210 200L190 200L200 100Z").attr({fill:"#000"}), 
    circle = svg.circle(200,200,5).attr({fill:"#f00"}); 

// Rotation settings 
var handAngle = 45, 
    centerX = 200, 
    centerY = 200; 

y = 0 

function a() { 
    y = (y + 90) % 360; 
    triangle.animate({transform: "r"+y + "," + centerX + "," + centerY}, 500, b); 
} 
function b() { 
    y = (y + 90) % 360; 
    triangle.animate({transform: "r"+y + "," + centerX + "," + centerY}, 500, a); 
} 

a() 

Answer 1

主要是使用Raphael.animation（...）重複（無限）

http://codepen.io/ianw92/pen/xGbKJq

var anim=Raphael.animation({transform: "r360" + "," + centerX + "," + centerY}, 60000, 'linear').repeat(Infinity); 

triangle.animate(anim);