Three.js精确地形碰撞

Question

一直在使用WebGL库Three.js开发游戏引擎。我有基本的地形碰撞工作，我可以找到用户站在的脸。使用面顶点的平均或最大Y位置是不够的。

我可以使用什么公式来找到物体相对于“站立”的地形面的确切Y位置？假设我知道面部四个顶点位置和对象矢量位置。

飞机是一个THREE.PlaneGeometry（2000,2000,128,128），由高度图增强。上面的图像就是其中一张脸。

Answer 1

我不能在评论中加入代码，所以我把它放在这里。 你不需要做数学运算。让three.js为你做。您可以执行以下操作：

var plane = new THREE.Plane();
plane.setFromCoplanarPoints (v1, v2, v3);

// x, y, z: position of your object
var ray = new THREE.Ray (new THREE.Vector3(x, y, z), new THREE.Vector3(0, 1, 0));
var where = ray.intersectPlane (plane);

并从Vector3'中'使用y组件来改变对象的位置。

Answer 2

您可以轻松找到物体所在面部的高度

const down = new THREE.Vector3(0, -1, 0);
const raycaster = new THREE.Raycaster();

raycaster.set(obj.position, down);
const collisionResults = raycaster.intersectObject(terrain);

if (collisionResults.length > 0 && collisionResults[0].distance > 0)
   const pointHeight = collisionResults[0].point.y;

此时只需从对象的y坐标中减去pointHeight，即可获得相对高度。

const relativeHeight = obj.position.y - pointHeight;