7
$\begingroup$

Is there an easy way to draw hyperbolas in Adobe Illustrator given semi major axis a and eccentricity e? Presently my method is getting a bunch of x and y coordinates from Microsoft Excel and then assigning these coordinates to anchor points in Adobe Illustrator. This is very laborious and I'm eyeballing how far to pull out the tangent handles.

I use the same labor intensive method to draw parabolas.

I remember 1st derivatives from high school. So I believe I can give the correct slope to my tangent handles. Here's an attempt to draw a parabola:

enter image description here

I know the tangent at the (0, 0) has slope zero and the tangent at (2, 4) has slope 4. But how far do I pull out these tangent lines? By eyeballing I can get the curve to pass through points on the parabola. But eyeballing is imprecise.

Does the 2nd derivative determine how far I'd pull the tangent handles?

If anyone can give me a clue how to draw accurate ellipses and hyperbolas without investing a ton of effort, I'd be grateful.

If anyone's interested here's a few drawings of conic sections I've done in Illustrator.

$\endgroup$
1
  • 1
    $\begingroup$ The parabolas part is easy, because quadratic bezier curves are parabolas. Such curves have only one intermediate control point $Q$, which is the intersection of the tangents at the end points. Cubic bezier curves can emulate the quadratic ones: From each end point, go two-thirds of the line segment toward $Q$, this gives the two cubic control points. Approximating hyperbolas and ellipses is another matter though. $\endgroup$
    – ccorn
    Sep 6, 2016 at 6:16

1 Answer 1

7
$\begingroup$

The steps are as follows:

  1. Draw the tangent lines at the end-points $\mathbf{P}_0$ and $\mathbf{P}_1$ of the hyperbola.
  2. Draw a line $L$ that's tangent to the hyperbola and parallel to the chord $\mathbf{P}_0\mathbf{P}_1$.
  3. Intersect the line $L$ with the two tangent lines to get the points $\mathbf{P}_r$ and $\mathbf{P}_s$.
  4. Compute (or construct) the points $$ \mathbf{P}_a = \mathbf{P}_0 + \tfrac43(\mathbf{P}_r - \mathbf{P}_0) $$ $$ \mathbf{P}_b = \mathbf{P}_1 - \tfrac43(\mathbf{P}_1 - \mathbf{P}_s) $$ In other words, you construct $\mathbf{P}_a$ so that $\mathbf{P}_r$ is three-quarters of the way along $\mathbf{P}_0\mathbf{P}_a$, and similarly for $\mathbf{P}_b$.

The points $\mathbf{P}_a$ and $\mathbf{P}_b$ are the Bézier control points for the desired cubic curve.

The points $\mathbf{P}_r$ and $\mathbf{P}_s$ are called the Timmer control points of the curve, after their inventor, Henry (Hank) Timmer. The idea was used in internal systems at Douglas Aircraft for many years, and eventually published as "Alternative representation for parametric cubic curves and surfaces." Computer-Aided Design, 12:25-28, 1980. In some ways, the Timmer control points are more intuitive controls than the Bézier points, but they are not well known, and I don't know of any software that uses them today.

This construction will give you a fairly decent approximation of any conic section curve. Both the conic and the cubic will be tangent to the line $L$ at the mid-point $\mathbf{P}_m$ of $\mathbf{P}_r\mathbf{P}_s$. If the conic happens to be a parabola, the cubic will replicate it exactly. The technique works for circular arcs, in particular. Please refer to this question to learn more about the basic technique and a slight improvement that's possible (though probably not worth the trouble in your case).

The picture below illustrates the construction enter image description here

$\endgroup$
6
  • $\begingroup$ Does choosing $L$ parallel to $P_0P_1$ give the "best" approximation in some sense? $\endgroup$
    – user856
    Sep 17, 2016 at 1:12
  • $\begingroup$ Not best, but pretty good. The cubic and the conic will be tangent to each other at the mid-point of the line $\mathbf{P}_r\mathbf{P}_s$, but the cubic will be everywhere "outside" the conic. Making the control points slightly closer to the end-points will give a better approximation, but the calculation/construction is much more complicated. For drawing curves in Illustrator, the method I described is probably good enough. $\endgroup$
    – bubba
    Sep 17, 2016 at 1:17
  • $\begingroup$ If the original curve is a 90-degree circular arc with radius $=1$, then the simple technique gives you an approximation error of about 0.00027. Using the adjustment I described, you can reduce this to about 0.00019, but it's usually not worth the effort. $\endgroup$
    – bubba
    Sep 17, 2016 at 1:26
  • $\begingroup$ Minor note. $P_r P_s$ is only tangent to the curve when it is parallel to $P_0 P_1$ (as here), even though it may visually appear otherwise. The full citation for (Henry, not Hank) Timmer curves is: Timmer, Henry. "Alternative representation for parametric cubic curves and surfaces." Computer-Aided Design, 12:25-28, 1980. Unfortunately, the only PDFs I've found are locked behind a paywall otherwise I'd link one here. $\endgroup$
    – tdenniston
    Sep 30, 2016 at 15:37
  • 1
    $\begingroup$ @proc-self-maps. The cubic always passes through the mid-point of $\mathbf{P}_r\mathbf{P}_s$, but will be tangent to $\mathbf{P}_r\mathbf{P}_s$ only when this line is parallel to the chord, as you say. Regarding "Henry, not Hank" -- I worked with him, and everyone called him Hank. In the US, "Hank" is a common informal abbreviation for "Henry". $\endgroup$
    – bubba
    Oct 1, 2016 at 0:38

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .