I want to be able to draw a line perpendicular ("normal") to a Bezier curve at a given point along it. The bezierTangent() language example includes a function that seems to do what I want:

Code:

bezier(85, 20, 10, 10, 90, 90, 15, 80);
stroke(255, 102, 0);
int steps = 16;
for (int i = 0; i <= steps; i++) {
  float t = i / float(steps);
  float x = bezierPoint(85, 10, 90, 15, t);
  float y = bezierPoint(20, 10, 90, 80, t);
  float tx = bezierTangent(85, 10, 90, 15, t);
  float ty = bezierTangent(20, 10, 90, 80, t);
  float a = atan2(ty, tx);
  a += PI/2.0;
  line(x, y, cos(a)*8 + x, sin(a)*8 + y);
}
 

And it does draw nice perpendicular lines along the specific s-curve created in the example, but when I alter the curve to nearly any other shape the lines are almost never normal. You can play with this in the interactive example at:
http://morrisdesign.com/projects/bezier_normals

Is there a different function I should be using The geometry seems right to me, so I'm hoping someone can straighten me out.

Dave, that is *exactly* what I was hoping for. Your custom function computes the x and y tangents in a way that gives the normals I want, and the other code snippet is more elegant. I've updated my example sketch to show both methods side-by-side for comparison: http://morrisdesign.com/projects/bezier_normals. I hope this will be helpful to anyone working the same issue.

Thanks for the excellent help.

I just looked at the example you posted. Very nice. I would like to correct a minor error. The fact that the single Bezier spline has two bends in it means it is a cubic, NOT a quadratic spline.