оживляющие пути с Рафаэлем

Question

Я все еще пытаюсь понять Рафаэля и застрял в некоторой базовой анимации. посмотрите здесь: http://jsfiddle.net/d7d3Z/

это достаточно просто: два пути, которые оживляют на место. Однако я хочу, чтобы он «нарисовал» это как одну линию, а не как начало вместе.

Как заказать анимацию?

Answer 1

Вы можете вызвать вторую анимацию после окончания первой.

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/

Answer 2

Используйте обратный вызов для animate : http://jsfiddle.net/pPwRP/

Это даст вам возможность выполнить обратный вызов после завершения первой анимации.

---

Для ленивых нажать - вот код

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);
    });
};