如何在 paper.js 中绘制样条线答案

【问题标题】：How to Draw Splines in paper.js如何在 paper.js 中绘制样条线
【发布时间】：2018-12-02 00:53:15
【问题描述】：

我目前正在开展一个项目，以在paper.js 画布上显示 DXF 文件。但是，当我读取 DXF 文件中的样条对象时，我完全被命名以及如何将它们转换为 paper.js curve 对象感到困惑。

DXF 有：degree、control points 和 know values

Paper.js 有：http://paperjs.org/reference/curve/

这是 DXF 样条数据对象的示例：

controlPoints:(15) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}],
degreeOfSplineCurve:5,
handle:"100",
knotValues:(21) [0, 0, 0, 0, 0, 0, 0.1, 0.2, 0.30000000000000004, 0.4, 0.5, 0.6, 0.7, 0.7999999999999999, 0.8999999999999999, 1, 1, 1, 1, 1, 1],
layer:"0",
numberOfControlPoints:15,
numberOfFitPoints:0,
numberOfKnots:21,
planar:true,
type:"SPLINE"

如果您需要更多信息，请告诉我

【问题讨论】：

标签： javascript computational-geometry spline paperjs cad

【解决方案1】：

DXF 曲线实现为任意阶非均匀有理 B 样条 (NURBS https://en.wikipedia.org/wiki/Non-uniform_rational_B-spline)，而 paper.js 仅支持三次贝塞尔曲线。在 Paper.js 中，一段贝塞尔曲线由一个点和 handleIn 和 handleOut 向量定义。见http://paperjs.org/reference/segment/

NURBS 是比贝塞尔曲线更通用的表示，因此可能无法用精确的贝塞尔曲线呈现任何 NURBS，但您仍然可以使用贝塞尔曲线或使用直线在 DXF 中找到足够接近的曲线近似值段。

【讨论】：