Js Raphael object.animate call doesn't work

Question

Hi I'm new to Js and I'm doing some simple moving of object with the Raphael library, but one of my functions doesn't work, even though it should.

Here's some of the code:

/*Moving Objects*/
    var mainBall = paper.circle(650,340,30);

    var mainRect = paper.rect(430,310, 50,50);

    
    /*Moving Object attributes*/
    mainBall.attr({fill:"45-purple-yellow"});

    mainRect.attr({fill:"45-purple-yellow"});

and the functions

function leavePipeB1(){

        mainBall.animate({cx:550, cy:340}, 1200, "linear", ball1ToMagnet);

    }

    function ball1ToMagnet(){

        mainBall.animate({cx:130, cy:115}, 1300, "elastic", showRect);

    }

    function leavePipeR1(){

        mainRect.animate({cx:550, cy:340}, 1200, "linear");

    }

    function hideBall(){

        tempBall.hide();
    }

    function hideRect(){

        tempRect.hide();
    }

    function hideEll(){

        tempEll.hide();
    }

    function showRect(){

        tempRect.show();
    }

I call them like this:

    hideRect();

    hideEll();

    leavePipeB1();

    hideBall();

    leavePipeR1();

But leavePipeR1() doesn't work.

Any way I could fix this?

Answer 1

This is because a Rect doesn't have a cx,cy property. Swap those for x,y instead.