Raphael JS : how to move/animate a path object?

Question

Somehow this doesn\'t work...

var paper = Raphael(\"test\", 500, 500);

var testpath = paper.path(\'M100 100L190 190\');

var a = paper.rect(0,0,10,10);
a.at         


        

Answer 1

Solved, with thanx to Rudu!

You need to create a new path to animate to. You can do this with clone() and then apply the transformations to that clone. Seems very complex for a simple move like this, but it works...

var paper = Raphael("test", 500, 500);

var testpath = paper.path('M100 100L190 190');

var a = paper.rect(0,0,10,10);
a.attr('fill', 'silver');

a.mousedown( function() {

  var temp = testpath.clone();
  temp.translate(400,0);
  testpath.animate({path: temp.attr('path')}, 1000);
  temp.remove();

});