math - 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 'where' 使用 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;