Question

I’m using the Raphael library to create SVG objects.

To initialise the SVG shape and create a canvas for everything inside, I’ve used the following line as stated in the documentation:

var paper = Raphael(10, 50, 320, 200);

I now want to animate the paper and everything inside it, just like I would animate a shape which had been appended to the paper in the following maner:

var firstShape = paper.rect(x, y, width, height);
firstShape.animate({x: 100}, 500, "<");

When I try something similar with the paper such as:

paper.animate({x: 100}, 500, "<");

I get the error ‘paper.animate is not a function‘.

What’s happening here, and how can I get around it?

Answer 1

Your closing bracket sequence is wrong

Change

paper.animate({x: 100, 500, "<")}; 

to

paper.animate({x: 100}, 500, "<"); 

UPDATE

From the docs, it does not seem that animate can be called directly on paper, but only on a sub-shape cut out of the canvas – that is why firstshape.animate works