[DrawSVG path length calculation when preserveAspectRatio:none]

@GreenSock much better!
But still not there yet, if you open your pen so entire parent div is visible, you'll see that path is drawn in the end:

[DrawSVG path length calculation when preserveAspectRatio:none]

@PointC you are correct, after turning off vector-effect: non-scaling-stroke animation is working correctly.
So it is problematic after all.

[DrawSVG path length calculation when preserveAspectRatio:none]

Quote

something else related with your path

Any hint? It's rather simple path.
Even in your video can be seen that path is fully drawn before scrollTrigger reaches end point.
I can see in Inspector that drawSVG is working until the end, but I don't understand why and where it got such big values from.

[DrawSVG path length calculation when preserveAspectRatio:none]

Hi @Rodrigo and many thanks for your answer!
I understand your point, but while this affects easing, it does not resolve the issue.
Problem is, green line is fully drawn before scrollTrigger reaches end.
And I believe this is due to preserveAspectRatio:none, but this property must stay in order for the curve to be responsive and fit its parent container.
 

[DrawSVG path length calculation when preserveAspectRatio:none]

Hello GSAP community!
I need help finding solution to correctly animate path using drawSVG; since svg has preserveAspectRatio:none in order to be responsive and fit its container, looks like drawSVG is not calculating path length right and finishes animation too soon.

Green line is the issue.
I've searched the forum and couldn't find any solution for this, any help is appreciated.

See the Pen VwNBzPB by gettonet (@gettonet) on CodePen