2011-08-05 16 views
6

Todavía estoy tratando de descubrir a Raphael y estoy atascado con algunas animaciones básicas. echar un vistazo aquí: http://jsfiddle.net/d7d3Z/animando caminos con raphael

es lo suficientemente simple: dos caminos que animan en su lugar. Aunque lo que quiero es que parezca 'dibujar' esto como una sola línea, en lugar de comenzar juntos.

¿Cómo puedo solicitar las animaciones?

Respuesta

9

puede llamar a la segunda animación después de la primera ha terminado.

window.onload = function() { 
    var c= Raphael("canvas", 200, 200); 
    var p = c.path("M140 100"); 
    var r = c.path("M190 60"); 

    p.animate({path:"M140 100 L190 60"}, 2000, function() { 
     r.animate({path:"M190 60 L 210 90"}, 2000); 
    }); 


}; 

http://jsfiddle.net/d7d3Z/1/

4

Utilice una llamada de retorno para animate: http://jsfiddle.net/pPwRP/

Lo que esto le dará es que va a ejecutar la devolución de llamada después de la primera animación ha terminado.


Para los perezosos de clic - Este es el código

window.onload = function() { 
    var c= Raphael("canvas", 200, 200); 
    var p = c.path("M140 100"); 
    var r = c.path("M190 60"); 

    p.animate({path:"M140 100 L190 60"}, 2000, function() { 
     r.animate({path:"M190 60 L 210 90"}, 2000); 
    }); 
};