Inspirational links for Beziers, SDF, text rendering, math in general and a question

[gregsn]

Newtons Method - Mr. Sanderson (3Blue1Brown) about

• SDF to a quadratic bezier function
• Root finding with Newtons method for any polynomial

The Beauty of Bézier Curves

• construct a coordinate system at any point
• get the tight bounding box
• do an arc length parameterization

Font Rasterization

• instead of distance-based approach, just tell me if I am inside or outside a curve.

SDF for text rendering

• somebody getting his hands dirty regarding this 2007 paper:
• Improved Alpha-Tested Magnification for Vector Textures and Special Effects

Shadertoy demos:

• SDF to quadratic bezier some hidden link to whiteboard scribbles
• little bit cleaner code maybe? root finding for some cubic function again done via Cardanos method
• pause it and enjoy there is more explanation of what cubic function actually has to be tackled with Cardano’s method. In danish

Epic Math Duell

• Root finding (again)
• Cardanos method to get roots for polynomials of 3rd order, aka cubic functions
• and the whole beauty of complex numbers, the universe and everything

---

Question
Can anybody point me to a good math article on how to derive the formula for the distance to a quadratic or even cubic bezier curve?
My danish is a bit rusty…
What I tried is to take the cubic bezier formula, subtract that from a spectator’s point, plug this into a formula of some greek guy in order to describe the length from the spectator’s point to any point on the curve (basically as 3blueonebrown was suggesting). And as he suggested we should now just take the derivative in order to find the t-values for which the distance is minimal. But I end up with a higher degree polynomial. So I guess just use Newtons method? But with which seeds to start this method?
I can see that the solution for the quadratic bezier distance in the danish article is taking a different approach than Mr. Sanderson…

[tonfilm]

Here is some more info: https://sluglibrary.com
This is used for text rendering in TD.

[gregsn]

That was quick! Thank you!
It looks like they always only tackle quadratic beziers. Alright…

[bjoern]

Don’t remember where I “found” this but it was still in my Browser history:

Fitting cubic Bézier curves

At the bottom of the article there is also a link to a related HN discussion and an other thread in a forum called TypeDrawers that might also yield some more info. hth

[tonfilm]

Also, Stride has SDF Font rendering based on 3 distance channels:

https://doc.stride3d.net/latest/en/manual/graphics/sprite-fonts.html#signed-distance-field-sprite-fonts

the shader can be found somewhere in the stride repo. the paper on that and more info can be found here, chapter 2.1 talks about bezier curves:

Shape Decomposition for Multi-channel Distance Fields

and related:

Sharp Corners with Signed Distance Fields Fonts

[gregsn]

In fact I’m hoping that some more insights can lead to fruitful developments in FUSE. As it’s full of SDFs… I am actually not really trying to solve a particular task (like rendering text), but I am trying to build up a mind map of connected topics that can help on different ends.
So thank you for all the links enhancing that map!!

[antokhio]

Maybe Shader - Shadertoy BETA
Or
Shader - Shadertoy BETA

[gregsn]

@antokhio that last one is awesome! Also comes with a lot of links again. SDF for cubic bezier… That’s what you want to have :)

[readme]

@woei is also very resourceful when it comes to beziers … maybe you can reach out to him. I think he also may have saved all sorts of useful bookmarks on the topic.