Remodeling Béziers
This article is about how math creates an easier-to-use version of Béziers. We’ll show examples of issues with Béziers, then discuss the issues academically, then derive a curve that fixes the problems (and can draw circles!).
This is a Bézier. You can drag the handles. The green lines represent curvature.
Béziers are a little unintuitive to use, because it’s not always clear where to put the control points, or how long the handles should be. This leads to a lot of trial and error. To see for yourself, use the handles below to align the black and pink curves.
Click “Show answer” when done. You probably got the curve right, but you had to go back and forth between the two handles, iterating the curve. You couldn’t set each handle to the correct position on the first try. (I can’t do it either.)
Here’s another one:
You probably got the curve close, but your handles are way off.
Adjust the middle node:
I don’t know of a reasonable way to guess the right location.
These illustrate the following problems with Béziers:
- It’s hard to guess the correct handle length on the first try; you have to see the result and adjust iteratively.
- The correct value of a handle depends on too many other things. If you move a node or handle, then you have to adjust its handles, then re-adjust the neighboring handles, then re-adjust the first handles, then re-adjust the neighboring handles, etc. You can’t set each handle to the correct value on its own. In mathematics, this means they are “non-orthogonal”.
- Widely different inputs can lead to similar outputs, and then you have to adjust neighboring handles a lot. In mathematics, this means the output-to-input map is “poorly conditioned”. This becomes an issue when it is not axis-aligned, like the second example.
- There’s no obvious way to figure out where to put nodes.
And there are three more problems:
- Béziers can’t represent circles. If you try to approximate one by hand, it’ll look lopsided.
- Deleting existing nodes from a curve creates a mess.
- It’s hard to keep curvature continuous across a node; you’d have to stare at curvature combs and fiddle a lot.
Mathematics resolves these issues.
Local and global
The words “local” and “global” appear in disparate domains in mathematics, like parallel evolution. These concepts are broadly useful.
Small and simple objects are “local”. Large and complex objects are “global”. For example, your house is a global object, and each room is a local object. If you want to know whether the whole house is painted white (a global property), you can check whether each individual room is painted white (a local property). This splits the global task into smaller local tasks.
The key insight is: Local properties are easy, and global properties are hard. Whenever global objects can be decomposed into local objects, it’s more convenient to work with the local objects. This is the backbone of the local to global principle.
A curve is determined by a finite number of points on the screen – those points are the artist’s interface. These points should control the curve locally, determining the curve in a small region.
In geometry, the standard local description of a curve is its derivatives, like a Taylor series. (We can safely ignore analyticity, thanks to Stone-Weierstrass.) The zeroth derivative is position – where the curve is. The first derivative is direction – which way the curve points. The second derivative is curvature – how curvy the curve is. These three parameters are easy for humans to understand, and artists don’t use higher derivatives. So the points
