Help me loop this SVG animatin

[miraclemaker]

Hi guys I've set up this animation using SVG. I want to have the infinity symbol always 50% filled and the animation to loop forever:

 

 

It's the last (3rd) step of the animation I'm having trouble with. When the start of the line hits 100% the other end should be on... 150%? Back on 50%? Neither of those work.

 

Many thanks for all your help!

See the Pen AXoZpY by anon (@anon) on CodePen

[PointC]

Hi miraclemaker 

 

Welcome to the GreenSock forums.

 

If I understand your desired outcome correctly, I think you're going to need two paths to make this work. This thread about seamlessly looping a circle should provide some guidance:

 

http://greensock.com/forums/topic/12546-seamless-loop-with-drawsvg/

 

Hopefully that helps.

 

Happy tweening.