Bezier Curves

Are there any computer graphics experts and/or mathematicians out there amongst the Teeming?

I’m working on a graphing program, using Flash. Flash is able to handle “quadratic Bezier curves” very quickly and easily, and I’d like to use them to draw my graphs (as opposed to the current system of plugging a ton of x values into the equation to generate the corresponding y values, and plotting those points).

Here’s what I need to know:

  1. How do I translate an equation (or part of an equation, see below) into those three points that I need to describe a Bezier curve?

  2. If I “divide and conquer” my graph (by finding inflection points, and drawing Bezier curves between them), can I accurately represent something like a sine or cosine wave? For the moment, I’ll accept “close enough”, but I’d prefer to have it down to within a pixel or two of the actual curve.

For the moment I’d like to stick to quadratic Bezier curves, but I think I can get it up to cubic without losing TOO much to processing time (quadratic Bezier curves are built into Flash, so my life is much easier if I can use them).

AFAIK, proper Bézier curves are parametrized cubics:

x(t) = (1-t)[sup]3[/sup]x[sub]0[/sub] + 3t(1-t)[sup]2[/sup]x[sub]1[/sub] + 3t[sup]2/supx[sub]2[/sub] + t[sup]3[/sup]x[sub]3[/sub]
y(t) = (1-t)[sup]3[/sup]y[sub]0[/sub] + 3t(1-t)[sup]2[/sup]y[sub]1[/sub] + 3t[sup]2/supy[sub]2[/sub] + t[sup]3[/sup]y[sub]3[/sub]

They have the property that

(x(0),y(0)) = (x[sub]0[/sub],y[sub]0[/sub])
(x(1),y(1)) = (x[sub]3[/sub],y[sub]3[/sub])
(x’(0),y’(0)) = 3(x[sub]1[/sub]-x[sub]0[/sub],y[sub]1[/sub]-y[sub]0[/sub])
(x’(1),y’(1)) = 3(x[sub]3[/sub]-x[sub]2[/sub],y[sub]3[/sub]-y[sub]2[/sub])

Thus by picking the four points (x[sub]0[/sub],y[sub]0[/sub]), (x[sub]1[/sub],y[sub]1[/sub]), (x[sub]2[/sub],y[sub]2[/sub]), (x[sub]3[/sub],y[sub]3[/sub]) you can describe a curve with given starting and ending points and initial and terminal velocities of parametrization and with certain curvature properties related to the fact that the parametrization is at most cubic. How closely this can approximate a given curve is a very deep subject, though.

As far as doing it on a sine curve, it’s possible. The accuracy goes up with the number of points you pick. Why you’d draw a sine curve by piecing together Béziers, I don’t know.

Flash uses quadratic Beziers (as opposed to the cubic Beziers you described). The reason I want to construct a sine curve by piecing together Beziers is that Flash doesn’t have a native way to draw a sine curve, per se–you can construct Bezier curves, or you can plot thousands of points. The Bezier-curve method SHOULD be far faster than the thousands-of-points method, if I can get it to work.

So… say I’m trying to plot y = sin(x) from -pi to pi. How might I do that using “quadratic Bezier curves”, meaning curves defined by 3 points.

If it helps, here’s what I’ve found for the equation for a quadratic Bezier curve (if i didn’t copy it incorrectly):
x(t) = (1-t)[sup]2[/sup]x[sub]0[/sub] + 2t(1-t)x[sub]1[/sub] + t[sup]2[/sup]x[sub]2[/sub]
y(t) = (1-t)[sup]2[/sup]y[sub]0[/sub] + 2t(1-t)y[sub]1[/sub] + t[sup]2[/sup]y[sub]2[/sub]

Where x[sub]0[/sub] is the first “anchor point”, x[sub]1[/sub] is the “handle”, and x[sub]2[/sub] is the second “anchor point”.