Element.status（）を使用する方法。 Raphael.js

Question

文書があまりにも繁殖しています。 Raphael.jsでElement.status（）を使用する方法を知っている人はいますか？デモをご用意できれば、 非常に感謝しています。

Answer 1

Element.statusは、要素に適用されている現在のアニメーションを表示します。または、特定のアニメーションのステータスを設定できます。

アニメーションを0と1の間で補間してみましょう。アニメーションの途中で0.5の値を持ちます。これは、アニメートされているすべての属性に適用されます。 （xを0から100の半分まで動かすと、状態は0.5になり、xは50になり、バウンスのように適用されたイージングは​​考慮されません）。

属性間にすばやい補間を作成する代わりに、10個の離散ステップで要素を移動させたいとします。アニメーションの都度、手動でステータスを設定することができます。例。

var raphAnimation = Raphael.animation({ x: 100, y: 100 }, 1000); 
rect.status(raphAnimation, 0.5) 

example jsfiddle

var rect = paper.rect(10, 20, 300, 200); 

var raphAnimation = Raphael.animation({ x: 100, y: 100 }, 1000); 

for(var c = 1; c <= 10; c++) { 
    (function() { 
     var step = c 
     setTimeout(function() { 
     rect.status(raphAnimation, 0.1 * step) 
     }, step * 200) 
    })(); 
} 

注：ステータスsetコマンドを使用して繰り返した場合、私はそれが新鮮なようなアニメーションを取ると思います。アニメーションが0-> 100で、ステータスを0.5に設定すると、半分になります。あなたが同じことをして、0.5でそれをもう一度呼び出すと、それは現在、トラバースする距離の半分しかないので、今度は「残余」の0.5になります。