[Math] Bézier approximation of archimedes spiral

bezier-curvegeometryplane-curvespolar coordinatesspline

As part of an iOS app I’m making, I want to draw a decent approximation of an Archimedes spiral. The drawing library I’m using (CGPath in Quartz 2D, which is C-based) supports arcs as well as cubic and quadratic Bézier curves. What is a good method of approximating an Archimedes spiral using either of these path types? For example the wikipedia exemplar image says it was “drawn as a series of minimum-error Bézier segments.” How would one generate such segments?

My math background takes me through Calculus III plus some stuff I picked up from a classical mechanics class, but it’s been a couple of years so I’m rusty. What I have so far:

For a spiral r = a + b $\theta$, I used the information from this page to find that the cartesian slope at any point (r, $\theta$) is equal to

$$\frac{dy}{dx}=\frac{b\sin\theta\space+\space(a + b\theta)\cos\theta}{b\cos\theta\space-\space(a + b\theta)\sin\theta}$$

From here, I could use point-slope to find the equation of a tangent line at any point, but how do I go about finding the proper lengths of the handles (i.e. the positions of the middle two points) for the curve? Or would an approximation with circular arc segments be better/easier/faster?

If I can’t figure it out, I’ll just use a static image in the app, but it occurs to me that I don’t even know of a way to generate a high-quality image of an Archimedes spiral! The Spiral tool in Illustrator, for example, does only logarithmic spirals.

Best Answer

So it looks like the Wikipedia reference image uses 45 degree sections of these curves. You can use the equation for the spiral to give you the tangent line at the beginning and end of these curve sections. Evaluate the derivative at these two points to get the tangent line slope and then shift your line appropriately to hit the point used. The intersection Of these two lines should be your control point. Once you have found your control point you can put it in the function 'CGPathAddQuadCurveToPoint' for the cx, cy (I think) along with the point you want to go to (also from the spiral equation). For reference--check out the animation under 'quadratic curves' here

For extra speed, you only have to find 8 tangent lines max--just shift them out for the next cycle of the spiral and reuse them.

Related Solutions

[Math] Subdividing a Bézier curve into N curves

For a quadratic Bézier curve, you need the two endpoints as well as the middle control point (which is not part of the curve itself, while the two endpoints are). Your "algorithm" for splitting the curve into two halves actually only calculates the new endpoint in the middle, but does not provide any hints as to how the middle control points for the two halves should be calculated.

Assuming the overall Bézier curve has control points $P_0$, $P_1$ and $P_2$, the two sub-curves resulting from a split at position $z$ would have control points respectively:

$$ \begin{matrix} P_{1,0} = P_0 \\ P_{1,1} = (1-z)P_0 + zP_1 \\ P_{1,2} = (1-z)^2P_0 + 2(1-z)zP_1+z^2P_2 \end{matrix} $$

and

$$ \begin{matrix} P_{2,0} = (1-z)^2P_0 + 2(1-z)zP_1+z^2P_2 \\ P_{2,1} = (1-z)P_1 + zP_2 \\ P_{2,2} = P_2 \end{matrix} $$

I suggest that you give a look at http://pomax.github.io/bezierinfo/ for the maths of the solution above.

Edit I forgot to discuss the splitting into multiple chunks, sorry!

Now that you have a way to split a curve at an arbitrary $z$, you can proceed to do the splitting at arbitrary positions $z_1$, $z_2$ and so on, with the following algorithm ($Z$ contains the positions):

sort the positions in $Z$ so that $\forall i, j:i < j \Rightarrow z_i < z_j$;
compute the control points for the first sub-spline using $z_0$ (i.e. the lowest element in $Z$) and save these control points (they are part of the solution);
compute the control points for the remaining sub-spline (i.e. the second part) using, again, $z_0$
1. if there are no more elements in $Z$, save these control points (they are the last part of the solution)
2. otherwise do the following:
  1. update all elements in Z using the following formula: $$z_i \leftarrow \frac{z_i - z_0}{1 - z_0}$$
  2. eliminate the first element of $Z$ (i.e. $z_0$)
  3. restart from step #2 with the updated $Z$

At each step, this algorithm will provide you the control points for a sub-curve, except for the last iteration that will give you two.

There might be some concerns regarding the propagation of errors at each step. You can easily modify the algorithm to (pre)calculate all the remaining parts in step #3 directly from the input Bézier curve to split (this also includes the last section), and use them at each step for calculating the updated parameters for the intermediate parts. This is left as a simple exercise for the reader 😄

[Math] Bézier curve approximation of a circular Arc

For a unit semi-circle centered at the origin, the points are $(1,0)$, $(1, \tfrac43)$, $(-1, \tfrac43)$, $(-1,0)$. Translate, rotate, and scale as needed.

If the end-points of the diameter are $\mathbf{P}$ and $\mathbf{Q}$, proceed as follows:

Let $\mathbf{U}$ be a vector obtained by rotating $\vec{\mathbf{P}\mathbf{Q}}$ through 90 degrees. Then the control points are $\mathbf{P}$, $\mathbf{P} + \tfrac23 \mathbf{U}$, $\mathbf{Q} + \tfrac23 \mathbf{U}$, $\mathbf{Q}$.

Pseudocode is as follows

Vector V = Q - P;
Vector U = new Vector(-A.Y, A.X);   // Perpendicular to PQ
double s = 2.0/3.0;                 // Scale factor
Vector[] controlPoints = { P, P + s*U, Q + s*U, Q };

For general circular arcs, complete details are given in "Good approximation of circles by curvature-continuous Bézier curves", by Tor Dokken, Morten Dæhlen Tom Lyche, Knut Mørken, Computer Aided Geometric Design Volume 7, Issues 1–4, June 1990, Pages 33-41.

Best Answer

Related Solutions

[Math] Subdividing a Bézier curve into N curves

[Math] Bézier curve approximation of a circular Arc

Related Question