计算相机近平面和远平面边界

Chr*_*gan 3 javascript three.js

我正在尝试执行使用 THREE.Frustum 计算近/远平面顶点中提到的计算。我使用了问题和答案/sf/answers/841540381/来组合一个完整的工作示例http://jsfiddle.net/cZb66/,它将粒子放置在远的边界平面,在这种情况下,近平面非常接近,以至于粒子会遮挡视线。出于某种原因,远平面点并不像我预期的那样位于相机的范围(窗口的角落)。

hNear = 2 * Math.tan(camera.fov / 2) * camera.near; // height
wNear = hNear * camera.aspect; // width

// Far Plane dimensions
hFar = 2 * Math.tan(camera.fov / 2) * camera.far; // height
wFar = hFar * camera.aspect; // width

var farTopLeft = new THREE.Vector3( wFar / 2, hFar / 2, -camera.far );
var farBottomRight = new THREE.Vector3( -wFar / 2, -hFar / 2, -camera.far );
var farTopRight = new THREE.Vector3( -wFar / 2, hFar / 2, -camera.far );
var farBottomLeft = new THREE.Vector3( wFar / 2, -hFar / 2, -camera.far );

// adjust the vectors to the camera location and direction
camera.updateMatrixWorld();
farTopLeft.applyMatrix4( camera.matrixWorld );
farBottomRight.applyMatrix4( camera.matrixWorld );
farTopRight.applyMatrix4(camera.matrixWorld);
farBottomLeft.applyMatrix4(camera.matrixWorld);

var z = 1;
var farParticles = new THREE.Geometry();
farParticles.vertices.push(new THREE.Vector3(farTopLeft.x, farTopLeft.y, z));
farParticles.vertices.push(new THREE.Vector3(farBottomRight.x, farBottomRight.y, z));
farParticles.vertices.push(new THREE.Vector3(farTopRight.x, farTopRight.y, z));
farParticles.vertices.push(new THREE.Vector3(farBottomLeft.x, farBottomLeft.y, z));
farParticles.vertices.push(new THREE.Vector3(0, 0, 0));
Run Code Online (Sandbox Code Playgroud)

Wes*_*ley 5

你很接近。camera.fov以度为单位。您需要camera.fov在计算可见高度时转换为弧度。

hNear = 2 * Math.tan( camera.fov * Math.PI / 180 / 2 ) * camera.near;
Run Code Online (Sandbox Code Playgroud)

还有一些其他错误。这是一个工作小提琴:

http://jsfiddle.net/cZb66/3/

三.js r.66

编辑:更新了 jsfiddle 链接到具有 1x1 附近粒子的版本。