Page 10: Arc-Length Parameterizations

Arc length parameterization is discussed in Section 15.1.1 of FCG4 Chapter 15. The Beauty of Bezier Curves has a nice animated explanation, including the approximation methods I describe here.

Box 1: Arc-length and non-arc length

We usually like to define our parameterizations such that each piece goes from 0 to 1. But this means that if we move at a constant speed in the parameter, the pen would move at a variable speed. An arc-length parameterization is a parameterization where the pen moves at a constant speed (assuming the parameter changes at a constant speed).

For an example in 05-10-01.js ( 05-10-01.html), consider a set of line segments that go around a rectangle. Let the 4 corners be p0, p1, p2 and p3, and let the rectangle be (20,20) to (120,40). So it is 20 pixels high and 100 pixels wide. The most obvious parameterization has each line segment with a unit parameterization. The top segment would be 0-1, the right segment would be 1-2, the bottom segment would be 2-3, and the left segment will be 3-4. Each segment takes the same amount of “parameter”, so if we change u at a constant rate, the pen will be moving 5 times faster in the horizontal segments than in the vertical ones. This is the red dot in the animation. Click the checkbox to start the animation, or scrub with the slider.

The green dot takes the same amount of time (t=0 to 4) to move around the rectangle, but it moves at a constant speed on the screen.

A way to think about it: consider measuring distance along the curve (starting at the zero point). The total curve (the perimeter of the rectangle) is 240 units. We can measure how far we’ve moved along the curve (from 0 at the start to 240 when we complete the loop). We could use this distance as the parameter (interpreting the parameter as “move this many distance units along the curve”). This is an arc-length parameterization. Because we’re measuring distance with the parameter, if we move a certain amount of parameter, we will always move the same amount of distance along the curve.

Of course, we can scale things so that the units of distance match the range we have of the parameter - we can scale the parameter that goes from 0-4 so that each unit of parameter means 60 units of distance. But, the speed remains constant as we go around the rectangle. Each animation step is .05 units of parameter, and goes 3 pixels of distance (60 * .05). This is the same whether we’re on a long horizontal or a short vertical. In contrast, using the per-segment parameterization, the speed was 5 pixels per step on the horizontals (100 * .05), and 1 pixel per step on the verticals (20 * .05).

Box 2: Another Arc-Length Example

Here’s an even simpler example in 05-10-02.js ( 05-10-02.html): a single, straight line segment in 1D. We have two parameterizations: f(u)=u and g(u)=u*u. Since u is in the range 0 to 1, both begin and end in the same place, and sweep out the same set of points (if we took infinitely small steps). With the two functions, the “pen” traces out the same curve (a line), but with different timings.

You should note that f (red dot) is an arc-length parameterization, while g (green dot) is not. Given a constant rate for u, f moves at a constant rate, whereas g starts out slowly and speeds up.

The speed of the pen – how fast the dot moves for a given change in the parameter – is determined by the magnitude of the derivative of the position with respect to the parameter. For an arc-length parameterization, this is constant. Note that $ \partial f / \partial u = 1 $ – so f has the same derivative everywhere, so it meets this definition. In contrast, $ \partial g / \partial u = 2u $, which depends on u, and therefore changes as we move around the curve.

Arc-Length Re-Parameterizations

Arc-length parameterizations are often useful, especially when we are doing animation and want to have things move at a constant speed. However, it is usually easier to define curves in a way that is not an arc-length parameterization. We can then get an arc-length parameterization by re-parameterizing, define a function that converts from an arc-length parameterization to the given parameterization.

For example, in the second example above, we could define a “re-parameterization function” $ u=\sqrt{s} $ that allows us to convert an arc-length parameterization of the line into the parameterization given by the function g.

For a polyline (a connected set of line segments, as in the first example), we can implement re-parameterization by building a table. For different values of the parameter we can compute its distance from the start. We’ll use t as the parameter that goes from 0-4, and u as the parameter that goes from 0-1 for each individual segment:

t	distance
0	0
1	100
2	120
3	220
4	240

Now, given a distance, we can figure out the appropriate value of t. For example, if we want to know the parameter value for s=170, we can see that it falls between 120 and 220 in the table. Since it’s half-way between 120 and 220, we know that it should be half-way between the corresponding t values (since we are doing linear interpolation). So, s=170 corresponds to t=2.5.

This works out easily for line segments, since we know that linear interpolation works (half-way in distance is half-way in parameter space), and that we only need entries in the table for the break points (where we switch segments), since linear interpolation holds between them.

For more complicated, non-linear functions, we can approximate the re-parameterization function by sampling: we pick a set of values for t, compute the positions for each of these parameter values (which we can do because we have the parametric function), and then use the polyline connecting these points to approximate the distance. The larger the number of values of t we sample, the better the approximation that we get.

Here’s an example for a parabola $ f(u)=(100*u,100*u^2) $:

t	x	y	distance (to previous)	total distance
0	0	0	N/A	0
.2	20	4	20.4	20.4
.4	40	16	23.3	43.7
.6	60	36	28.3	72.0
.8	80	64	34.4	106.4
1	100	100	41.2	147.6

If we wanted to know where halfway in distance was (s = 147.6 / 2 = 73.8), we look it up in the table and see that it’s between t=.6 and t=.8. Since it is (73.8-72)/(106.4-72)=.052 of the way between rows, we can approximate that as .052*.2 +.6 = .61. Note that .2 is the step between rows of t.

You’ll get to implement this to arc-length parameterize the train track when we do that later in the workbook.

Box 3: Arc-Length Parameterize Me

Function myTri in 05-10-03.js ( 05-10-03.html) goes around a 50, 120, 130 right triangle (similar to a 5,12,13 triangle), but not in an arc-length parameterization. That’s the red dot. Fill in the function myTriAL that goes around the same triangle, but with an arc length parameterization. You only need to modify myTriAL. You may use other functions defined in the file. If things are working correctly, the green dot will go around the triangle at a constant speed when you click the “run” checkbox (whereas the red dot speeds up and slows down).

Arc-Length Parameterizations

Arc length parameterizations are a tricky concept.

Consider what “arc length” is (before we get to parameterization): it is the length along the curve. Imagine if you wrap a tape measure along the curve to measure how “long it is”; or you straighten out the curve to measure how long it is.

Given the idea of arc-length, you can think about its connection to parameterizations. Normally, we think about the length of the whole curve. But, given a curve $\mathbf{f}(u)$, we could consider the “first part of the curve starting at 0 and going to $u$”, and create a new function $a(u)$ which is the arc length of that curve. Every parameter value $u$ corresponds to some distance $a(u)$.

Arc length parameterization reverses this process: we use the distance along the curve as the parameter. We specify the distance $s$ (the arc length parameter), and compute the “regular parameter” from this using the inverse of the $a$ function above, $u=a^{-1}(s).$ Because this function changes from one parameterization to another, we call it a reparameterization. You could imagine a new “curve function” $\mathbf{f_s}(s)=\mathbf{f}(a^{-1}(s))$ that is an arc length parameterization of the original $\mathbf{f}$ - it’s the same curve, except with an arc length parameter.

You should notice that doing arc length parameterization (or reparameterization) requires not just finding the arc length function $a(u)$, but its inverse. Computing the arc length is hard enough - it requires solving an integral to compute the length, which usually cannot be done analytically. In practice, we usually estimate $a(u)$ using numerical techniques, and estimate it’s inverse using numerical techniques.

Why use arc length parameterization?

It may be best to think in terms of the “pen” as a moving object. With a regular parameterization, the curve may speed up and slow down. With an arc-length parameterization, the “speed” (the magnitude of the velocity) is constant.

Consider a simple example: a cubic $\mathbf{f}(u)=[u,u^2]$. The 1st derivative of this curve (tangent, or velocity if we think about the curve as the pen moving along the curve) is $\mathbf{f’}(u)=[1,2u]$. At the beginning of the curve the velocity is [1,0], at the end it is [1,1]. The pen “sped up” as it moves along the curve.

Another way to think about it: if we take uniform steps in $u$, the steps we take in the world will be differently sized. Here’s a simple example, taking 10 steps along $u$ (0, .1, etc) and drawing this curve. (see 05-10-04.html and 05-10-04.js). Notice how the steps towards the end are longer than the steps at the beginning.

An arc length parameterization would trace the same curve, but with even steps. The way to think about it is a way to change parameters - we make $s$ (the arc length parameter) move in even steps, and compute the corresponding $u$ values. We just need to come up with a reparameterization function $u=g(s)$ that does this. We can think of $s$ as being distance along the curve (hence the name arc-length parameterization).

In general, these functions are hard to derive analytically - we need to use numerical approximations. Even for this really simple parabola, the arc-length is a complicated function. Above, we looked at how to compute a table of approximate arclengths to approximate $s$ (distance along the curve) from $u$. Given the table, we can use lookups and interpolation to find the inverse.

Summary: Arc-Length Parameterization

Hopefully, you now have an intuition for what arc-length parameterization is, so you can read the mathematical definition in the textbook. You’ll need it next week to make the train.

Now, on to Page 11: Drawing Curves!