This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Philippe Côté
Posted Aug 03 - Read on Facebook

Hello Framer Group,

Is there a way to draw a bezier curve then animate the points directly in Framer without using any external JavaScript libraries?

I've looked upon paper.js, p5.js, two.js and snap.svg but thought there might be a much simpler way...

Thank you very much.

6 Comments

Dave Crow

I think that's what the Path module does: https://github.com/vladimirshlygin/framer-path

Sigurd Tapio Mannsåker

As in just specify the control points and have Framer draw the bezier curve? If that's it then I have done that on a canvas in vanilla js, I'll be happy to share the code with you tonight if no one else has hooked you up yet. On mobile now, sorry.

Philippe Côté

Sigurd Tapio Mannsåker Yes, that could be useful too! Thank you! Dave Crow Thank you very much!

Trevor Phillippi

I ran into this recently where I wanted to just draw a path in Sketch to get everything right visually. I exported to svg, included the svg in a layer's html and then made a little helper function to draw the point on the existing path. The above solutions may work but if you already have the path/svg like I did I can try and pull the code out of the project and make an example.

Sigurd Tapio Mannsåker

Philippe Côté: Here is the thing I made, not sure if it's relevant for you. Very rudimentary, no interactivity, just made it to illustrate how bezier curves are drawn: http://www.sigurd.io/canvas/05/

Jordan Robert Dobson

Following.

Read the entire post on Facebook