小编soi*_*ber的帖子

我试图根据之前计算得到的一些贝塞尔曲线在 Three.js 中绘制一条弯曲的道路，问题是我找不到转换曲线序列的方法（一条从上一条曲线的末尾开始）到一个曲面。

我有一个 3D 场景，其中有一些汽车、一条用飞机创建的道路，并且绘制了即将到来的道路的路径。我使用我所说的贝塞尔曲线将路径表示为一条线

function createAdasisBezier(initx, inity, cp1x, cp1y, cp2x, cp2y, finalx, finaly) {
  bezier = new THREE.CubicBezierCurve3(
    new THREE.Vector3(initx, inity, 0),
    new THREE.Vector3(cp1x, cp1y, 0),
    new THREE.Vector3( cp2x, cp2y, 0),
    new THREE.Vector3(finalx, finaly, 0)
  );
  curvePath = new THREE.CurvePath();
  curvePath.add(bezier);

  var geoPath = curvePath.createPointsGeometry( 5 );
  var lineMat = new THREE.LineBasicMaterial({color: 0xff0000});

  curveLine = new THREE.Line(geoPath, lineMat);

  curveLine.rotation.set(-Math.PI/2,0,0);
  curveLine.position.y = 0.1;

  scene.add(curveLine);
}

首先，我尝试挤压这条线，但后来我意识到这可能不是解决方案，因为我想做一条路，尽管我可以移动 X 和 Y 上的顶部顶点，将它们放置在贝塞尔曲线附近，以便成为外部曲线的一部分，结果不仅不利，而且无法保持左右曲线之间的关系。

为了移动顶点（一旦确定），我做了一个循环并手动移动它们：

for (var i = 0; i …

I\xc2\xb4m 试图画一些平行线的曲线，一条一条相邻，但如果我通过修改/平移它们在一个轴上的位置来将它们分开，结果不是我想要的。

代码很简单，用贝塞尔曲线制作中央路径，并用其他材料克隆侧面。

var bezier = new THREE.CubicBezierCurve3(\n                new THREE.Vector3(initx, inity, 0),\n                new THREE.Vector3(cp1x, cp1y, 0),\n                new THREE.Vector3( cp2x, cp2y, 0),\n                new THREE.Vector3(finalx, finaly, 0)\n                );\n\nvar curvePath = new THREE.CurvePath();\ncurvePath.add(bezier);\n\nvar path = curvePath.createPointsGeometry( 5 );\npath.computeLineDistances();\n\nvar lineMat = new THREE.LineDashedMaterial({ color: 0xFFFFFF,\n                                             dashSize: 3,\n                                             gapSize: 2, \n                                             linewidth: 10});\n\nvar curveLine = new THREE.Line(path, lineMat);\n\ncurveLine.rotation.set(-Math.PI/2,0,0);\ncurveLine.position.y = 0.1;\n\nvar leftLine = curveLine.clone();\nleftLine.material = matLine;\n\nvar rightLine = curveLine.clone();\nrightLine.material = matLine;\n\nleftLine.translateX(-3.5);\nrightLine.position.set(3.5,0,0);\n\nscene.add(curveLine);\nscene.add(leftLine);\ncurveLine.add(rightLine);\n

这是结果：\n

这是我正在寻找的一些示例：

最后两张图片来自Bezier.js库。

我认为对曲线应用 …