Path in MotionPathPlugin

[chevohin]

Hi guys, i need your help.

 

I have a scene in adobe illustrator which I export to svg and insert in html.

 

Somewhere in the scene I have a group with id #toy and a path with id #path (I made the path visible).

After the click on #toy I want it to move along the #path.

In my scene now after the click, the #toy just disappears. I think it is because of some relativeness, so may be it adds the path coords to its current coords.

 

What should I change to fix it?

I want the moving object and the path to be in the same svg.

See the Pen mdEeyXz by chevohin (@chevohin) on CodePen

[ZachSaucier]

Hey chevohin. You just need to use the align property. You probably also want to change the alignOrigin to [0.5, 0.5] (the center).

 

Side notes:

• .restart() is equivalent to .play(0).
• ease: "Power3.easeOut" is invalid. Just use ease: "power3".

Here's how I'd set it up:

See the Pen vYKKQwE?editors=0010 by GreenSock (@GreenSock) on CodePen

[chevohin]

Thank you, bro!