Start "removing" DrawSVG line while drawing

[pils 2 Likes (Newbie)]

Wow, this title must make sense. Hopefully the Codepen helps making this clear.

 

So i have this path that i draw with DrawSVG, and it's "removed" after the whole line is drawn. Now i want the remove-effect happening while the line is still drawing on the other end. Lowering the delay on the remove-effect is not working so i think i'm going about this the wrong way. How should i do this?

See the Pen XWbXBQa by luffyy (@luffyy) on CodePen

[Shrug ¯\_(ツ)_/¯ 947 Likes (Leader)]

1 hour ago, pils said:

i want the remove-effect happening while the line is still drawing on the other end

 

Have a look at the following thread and article about chasing lines by @PointC

 

https://greensock.com/forums/topic/19030-how-to-create-seamless-loop-of-svg-rect/
https://codepen.io/PointC/post/seamless-loop-svg-stroke-animations

[ZachSaucier 7,152 Likes (Superhero)]

Hey pils and welcome!

 

In addition to Shrug's suggestion, you can play around with different drawSVG values to get the type of effect that you're going for:

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

[Shrug ¯\_(ツ)_/¯ 947 Likes (Leader)]

@ZachSaucier that would of been a good suggestion in this recent previous thread also. 😉

[pils 2 Likes (Newbie)]

Wow, finally had some time to play around with this again. And indeed it seems playing around with the values will get the job done. It's not perfect yet but i will get there. Thanks for the help!

 

See the Pen GRJjgrw by luffyy (@luffyy) on CodePen