Draw Stroke, Then Fill

[benjino 10 Likes (Newbie)]

I'm trying to draw the stroke, then fill the shapes. What am I missing here?

See the Pen PKJORa by benjino (@benjino) on CodePen

[Carl 9,066 Likes (Superhero)]

Thanks for the demo. The main problem is that setting the opacity of the group to 0 also hides the paths you are trying to reveal with DrawSVG.

Instead of animating the opacity of the group, try animating the fill of the paths.

 

I removed the repeats and simplified the syntax just to illustrate how to animate the fills.

 

See the Pen XaeYBo by GreenSock (@GreenSock) on CodePen

 

[benjino 10 Likes (Newbie)]

Alright, thanks. I see what I wasn't getting. I did try {fill:none},{fill:black}. I forgot to put quotes around values.

 

Thanks for clueing me in on this!