时间戳

首页 > 解决方案 > 如何在 paper.js 中绘制样条线

javascript - 如何在 paper.js 中绘制样条线

问题描述

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

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"

如果您需要更多信息，请与我们联系

标签： javascriptcomputational-geometrysplinepaperjscad

解决方案

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 中找到足够接近的曲线近似值。

推荐阅读