Draw good-looking Bezier Curve through random points

Nameless picture Nameless · Aug 10, 2011 · Viewed 14.2k times · Source

I'm using javascript with RaphaelJS to draw a smooth line through random points with output to SVG. The line goes strictly horizontally, without returning back in axis X. Currently, I'm using cubic Bezier curves to draw the line from one point to another.

Problem is, the line doesn't look good enough. Two curves have an unsightly join at a point, where one curve ends and another curve starts, with quite random angle in the joint. How do I get the previous curve to transform into next one smoothly, while still keeping the line passing through given point?

Answer

heycam picture heycam · Aug 10, 2011

Catmull-Rom curves work well for going through points. http://schepers.cc/getting-to-the-point