如何使用Element.status（）;在Raphael.js

Question

該文件太breif。 任何人都可以知道如何在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，因爲它現在只有一半的穿越距離。