Upcoming Events
Unite 2010
11/10 - 11/12 @ Montréal, Canada

GDC China
12/5 - 12/7 @ Shanghai, China

Asia Game Show 2010
12/24 - 12/27  

GDC 2011
2/28 - 3/4 @ San Francisco, CA

More events...
Quick Stats
96 people currently visiting GDNet.
2406 articles in the reference section.

Help us fight cancer!
Join SETI Team GDNet!
Link to us Events 4 Gamers
Intel sponsors gamedev.net search:

Contents
 Intro &
 Mathematics

 Programming
 Creating Surfaces
 Conclusion

 Printable version
 Discuss this article

Programming with Bézier Splines

Ok, so we have our basis function's. Now it's time to put them to good use.

I think that now would be a really good time to mention that along with these functions, you should also have 3 control points, which we'll call Cx. You can save these control points in a structure that looks like this:

typedef struct sCPoint
{
	int x;
	int y;
}  C_POINT;

NOTE: We will be working with bézier splines in 2d only, but if you wanted 3d bézier splines you would simply add a z component to this structure.

And of course you would have 3 of them, so an array of control points would be appropriate.

C_POINT controlP[3];

Ok, now were going to get into the actual drawing of bézier splines on the screen. Right now, our curve is only imaginary, and only exists as math equations. What we have to do is go along our curve, using the equations that we got, and put dots along our curve path, to make it appear on the screen.

Which brings us to the last thing that I want to talk about; Detail Biases. Basically what a detail bias is, is a number that tells us how far we want to move along our curve each time we want to put a pixel along it's path. Detail biases are always decimals, and are most easily thought of as percentages. A detail bias of 0.5 would say "Ok, start at the beginning of our curve, put a point there, move 50% along our curve and put a point there, then move 50% more and put a point there (at the end of our curve).", this would put a point at the start of our curve, in the exact middle, and at the very end. We would need a counter to keep track of how much of the curve we've rendered, and we would increase this counter by 0.5 each time we put a point until it reaches 1, at which point we would stop. The smaller your detail bias, the more points you'll have on your curve, and the more solid it will look. Ok, without further adieu, the code to render a quadratic bézier spline. It should be noted that the macros Bx() where already defined up top, as were the controlP structures.

//Note: it is assumed that each controlP has already been filled out with
//an x and y coordinate.

double count = 0;  //used as our counter
double detailBias; //how many points should we put on our curve.

double x,y; //used as accumulators to make our code easier to read


detailBias = 1 / 50; //we'll put 51 points on out curve (0.02 detail bias)

do
{
x = controlP[0].x*B1(count) + controlP[1].x*B2(count) + controlP.x[2]*B2(count);
y = controlP[0].y*B1(count) + controlP[1].y*B2(count) + controlP.y[2]*B2(count);

	PutPixel(x,y,RGB(255,255,255));

	count += detailBias;

}while( count <= 1);

Notice how we get our x and y values. We multiply each control point by the coresponding basis function (B1 with control point 1, B2 with control point 2, etc.), and add them all together. We do this for both the x and y coordinates, and if we're working in the third dimension, the z coordinate as well.



Next : Creating Surfaces Out of These Curves