Skip to content

正投影相机

正投影长方体可视空间

正投影相机的长方体可视化空间和透视投影视椎体类似,只是形状不同

正投影相机

js
// 构造函数格式
OrthographicCamera(left, right, top, bottom, near, far);
参数含义默认值
left渲染空间的左边界
right渲染空间的右边界
top渲染空间的上边界
bottom渲染空间的下边界
nearnear 属性表示的是从距离相机多远的位置开始渲染,一般情况会设置一个很小的值0.1
farfar 属性表示的是距离相机多远的位置截止渲染,如果设置的值偏小小,会有部分场景看不到2000

渲染范围设置

设置正投影相机长方体可视化空间的渲染范围

js
// 正投影相机
const width = window.innerWidth; // canvas画布宽度
const height = window.innerHeight; // canvas画布高度
const k = width / height; // canvas画布宽高比
const s = 600; // 控制left, right, top, bottom范围大小
const camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 7000);

相机位置和观察目标设置

相当于相机放在 y 轴上,向下观察地面上阵列的长方体

js
camera.position.set(0, 2000, 0); // 相机放在了y轴上
camera.lookAt(0, 0, 0); // 指向坐标原点

注意.position 位置和 far 参数的设置,确保你想看到的物体能够包含在 far 之内,超出 far 的不会渲染

测试:far 减小,物体不在可视化空间之内,则看不到

js
new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 500);

测试:.position.y 增大,物体不在可视化空间之内,也看不到

js
camera.position.set(0, 10000, 0);

上次更新于: