javascript - 将 B 样条曲线转换为贝塞尔曲线

标签 javascript html5-canvas spline dxf bspline

我有一条 B 样条曲线。我有所有的结,以及控制点的 x、y 坐标。

我需要将 B 样条曲线转换为贝塞尔曲线。

我的最终目标是能够在 html5 canvas 元素上绘制形状。 B 样条曲线来自不支持 Beziers 的 dxf 文件,而 Canvas 仅支持 Beziers。

我找到了几篇试图解释该过程的文章,但是它们让我有些头疼,而且似乎真的非常理论密集。我真的需要一个例子或一步一步的帮助。

这是我发现的: (Explains B-Splines) , (Converting to Beziers) , (Javascript Example)

最后一个链接很好,因为它包含实际代码,但它似乎没有考虑节点分配的权重。我认为这很重要,因为它似乎会影响曲线是否通过控制点。

如果有用的话,我可以分享我的节点或控制点。如果有人能指出我的分步过程或帮助我编写一些伪(或实际)代码,我将不胜感激。

最佳答案

不久前,我为三次 B 样条曲线编写了 Boehm 算法的简单 Javascript 实现。这是一个涉及极值的相当简单的实现,如第 6.3 节所述:Computer Aided Geometric Design- Sederberg

如果您只对实现感兴趣,我已经链接了我在此处编写的类:bsplines.js

关于javascript - 将 B 样条曲线转换为贝塞尔曲线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17053735/

相关文章:

javascript - 我不想在 <span> 悬停时更改按钮背景

javascript - 优化 HTML5 canvas 中的像素设置

javascript - 鼠标滚轮缩放

javascript - JS/HTML5 - 使用数组中的图像数据重绘 Canvas

qt - Qml样条图中的异常

matlab - 在 Matlab 中,使用 length(x) 时出错,给出下标索引错误

javascript - 使用 Mobx 在其他函数内调用函数

javascript - 如何使用带有代码的表情符号[即:-) ] in angular. js?

python - 如何在样条插值的所有数据点处设置导数零约束?

javascript - Google 文档 - 实时访问文本更改