Here’s a low-fidelity example of SVG stroke animation using the dashOffset and dashArray properties in Framer v108. Hope it helps. 💫
Amazing. So no modules? Just framer? This looks really close to the AE trim paths effect...
Thanks Benjamin Den Boer. I am trying to replicate this immediately following a loading animation. In this case, press button, loading animation and then a line drawing of a circle followed by a checkmark. It is currently saying that svg = shape.svg is not an object. Not sure what I'm doing wrong - https://framer.cloud/eYXqQ
Any help you can offer is appreciated.
I just isolated the circle and checkmark and am running into trouble with svg.setAttribute which says "is not an object"
Hi Denis Lesak—I see. You are referencing the Frame (so, a DIV), not the SVG Path element directly. You can easily fix by passing along your "circlePath" path instead of the "circle" layer. :-)