動畫路徑形狀與raphael.js

Question

我想知道您是否有人知道如何動畫與raphael.js路徑形狀。

所以我做了一個隨機的路徑形狀，如：

var paper = Raphael(10, 50, 320, 200); 
var c = paper.path("M 250 250 l 0 -200 l -50 0 l 0 -50 l -50 0 l 0 50 l -50 0 l 0 50 z"); 
c.attr({ fill: '#000' }); 

，並希望這條道路onclick動畫到

c.click(function() { 
    //alert(2); 
c.animate({ 
    path: ("M 250 250 l 0 -40 l -50 0 l 0 -50 l -50 0 l 0 50 l -50 0 l 0 50 z") 
}); 

unfortunenatly這是行不通的。它只是改變形狀，但不是動畫。

，您可以嘗試here

謝謝！

Answer 1

你忘了設置動畫的時間...這裏是一個jsfiddle .. http://jsfiddle.net/y9XHw/和下面的解決方案。

$(function(){ 
var paper = Raphael(10, 50, 320, 200); 
var c = paper.path("M 250 250 l 0 -200 l -50 0 l 0 -50 l -50 0 l 0 50 l -50 0 l 0 50 z"); 
c.attr({ fill: '#000' }); 
c.click(function() { 
    //alert(2); 
    c.animate({ 
     path: ("M 250 250 l 0 -40 l -50 0 l 0 -50 l -50 0 l 0 50 l -50 0 l 0 50 z") 
    }, 2000); 
    }); 
});