Convert a B-Spline into Bezier curves

4
votes

I have a B-Spline curve. I have all the knots, and the x,y coordinates of the Control Points.

I need to convert the B-Spline curve into Bezier curves.

My end goal is to be able to draw the shape on an html5 canvas element. The B-Spline is coming from a dxf file which doesn't support Beziers, while a canvas only supports Beziers.

I've found several articles which attempt to explain the process, however they are quite a bit over my head and really seem to be very theory intensive. I really need an example or step by step help.

Here's what I've found: (Explains B-Splines),(Converting to Beziers),(Javascript Example)

The last link is nice because it contains actual code, however it doesn't seem to take into account the weight assigned by the nodes. I think this is kind of important as it seems to influence whether the curve passes through a control point.

I can share my Nodes or Control Points if that would be useful. If someone would point me to a step-by-step procedure or help me with some psuedo(or actual)code, I would be so grateful.

2
javascripthtml5-canvassplinedxfbspline
It would be helpful if you posted some of the information you have about the control points. For example, are your points [x, y], [x, y, w], [xw, yw, zw, w], or something else? Just post a small example of everything that defines a spline, that would help a lot. - tfinniga

2 Answers

1
votes

I wrote a simple Javascript implementation of Boehm's algorithm for cubic B-Splines a while back. It's a fairly straightforward implementation involving polar values, described here in section 6.3: Computer Aided Geometric Design- Sederberg

If you're just interested in the implementation, I've linked the classes I wrote here: bsplines.js

0
votes

This could be helpful - https://github.com/Tagussan/BSpline

My project has moved on and I no longer need it, but this seems to be a pretty useful way to feed control points and have a curve drawn.