Three.js 中的 Camera 及其视锥体坐标转换

关于 Three.js 中的 Camera 对象继承自基类 Object3D，它的另外的几个属性： .layers : Layers

摄像机是一个layers的成员. 这是一个从Object3D继承而来的属性。

当摄像机的视点被渲染的时候，物体必须和当前被看到的摄像机共享至少一个层。

.matrixWorldInverse : Matrix4

这是matrixWorld矩阵的逆矩阵。 MatrixWorld包含了相机的世界变换矩阵。

.projectionMatrix : Matrix4

这是投影变换矩阵。

.projectionMatrixInverse : Matrix4

这是投影变换矩阵的逆矩阵。

---

视点（camera）坐标系下的坐标与世界坐标系下的坐标

// Camera.matrixWorld 用于将某一视点（camera）坐标系下的坐标转换至世界坐标系下的坐标 let pView = new THREE.Vector3(1, 0, 0); pView.applyMatrix4(camera.matrixWorld); // view to world // Camera.matrixWorldInverse 用于将某一世界坐标系下的坐标转换至视点（camera）坐标系下的坐标 let pWorld = new THREE.Vector3(1, 0, 0); pWorld.applyMatrix4(camera.matrixWorldInverse); // world to view

视点（camera）坐标系下的坐标与规范化观察体中的坐标

// Camera.projectionMatrix 用于将某一视点（camera）坐标系下的坐标转换至规范化观察体中的坐标 let pView = new THREE.Vector3(1, 0, 0); pView.applyMatrix4(camera.projectionMatrix); // view to NDC // Camera.projectionMatrixInverse 用于将某一规范化观察体中的坐标转换至视点（camera）坐标系下的坐标 let pNDC = new THREE.Vector3(1, 1, 1); pNDC.applyMatrix4(camera.projectionMatrixInverse); // NDC to view

---

因此，可以得到相机（camera）的视锥体（frustum）的八个角点的世界坐标系下的坐标：

let frustumCornersNDCSpace = [ new THREE.Vector3(-1.0, +1.0, -1.0), new THREE.Vector3(+1.0, +1.0, -1.0), new THREE.Vector3(+1.0, -1.0, -1.0), new THREE.Vector3(-1.0, -1.0, -1.0), new THREE.Vector3(-1.0, +1.0, +1.0), new THREE.Vector3(+1.0, +1.0, +1.0), new THREE.Vector3(+1.0, -1.0, +1.0), new THREE.Vector3(-1.0, -1.0, +1.0), ]; /** * NDC - Normalized Device Coordinates * * _____________ (1, 1, 1) * / /| y * / / | | z * / / | | / * /____________/ | | / * | | | |/ * | | / +-------- x * | | / * | | / * |____________|/ * (-1, -1, -1) */ for (let i = 0; i < frustumCornersNDCSpace.length; ++i){ frustumCornersNDCSpace[i].applyMatrix4(camera.projectionMatrixInverse); // NDC to view frustumCornersNDCSpace[i].applyMatrix4(camera.matrixWorld); // view to world }

得到世界坐标系下的坐标后可继续相应的后续步骤来使用它们。