javascript - 将 threejs 网格包裹在另一个网格上

Question

我是 three.js 的新手，并且有一个要求，在网格中需要环绕另一个具有曲线的网格。在我的场景中，我分别有三个网格 plane1、plane2 和基础网格(椭圆体)。见下文。

我希望能够以某种方式将 plane1 和 plane2 网格投影到基础网格上，以便它包裹在基础网格的表面上。见下文。如果基地是为了例如。一个长方体，然后我将 plane1 和 plane2 放在它的平面上，但由于我的基础网格是弯曲的，所以我遇到了这个问题。这有可能在 threejs 中实现吗？您可以在 threejs 中将网格投影到另一个网格上？

Answer 1

好吧，要将一个网格“投影”到另一个网格的表面，您需要做一些 raycasting从外面到椭圆体的中心。 raycaster 可以为您提供交叉点的位置。假设您有一个位于 (0, 0, 0) 的椭圆体，您可以这样做:

https://threejs.org/docs/#api/en/core/Raycaster.set

// Vector with desired outer position
var startPoint = new Vector3(10, 5, 0);

// Normalized vector pointing toward center of ellipsoid 
// (basically in the opposite direction of startPoint)
var endDirection = new Vector3(-10, -5, 0).normalize();

raycaster.set(startPoint, endDirection);
var intersects = raycaster.intersectObjects( ellipsoid );
console.log(intersects);

您会看到 intersects 变量将有一个 object of this format生成的 (x, y, z) 截取点。