04-three.js Cameras

四喜花露水

已于 2025-06-22 21:22:01 修改

阅读量664

点赞数 24

CC 4.0 BY-SA版权

分类专栏： Three 文章标签： javascript 前端开发语言

于 2025-06-22 15:22:58 首次发布

本文链接：https://blog.csdn.net/gaowxx/article/details/148827974

Three.js Journey — Learn WebGL with Three.jsThe ultimate Three.js course whether you are a beginner or a more advanced developerhttps://threejs-journey.com/?c=p3

PerspectiveCamera

// new THREE.PerspectiveCamera(视野, 宽高比, 近裁剪面, 远裁剪面)
// 参数1 视野，通常使用视野在 45 到 75 之间的范围
// 参数2 宽高比，建议将画布宽度与高度的值保存在一个对象中，因为我们以后会多次用到它们
// 参数3 near，参数4 far
const camera = new THREE.PerspectiveCamera(75, sizes.width / sizes.height, 1, 100)

OrthographicCamera

// new THREE.OrthographicCamera（left, right, top, bottom, near, far）
// 渲染了一个正方形区域，但这个正方形区域会被拉伸以适应这个矩形画布，而目前的画布不是一个正方形
const camera = new THREE.OrthographicCamera(- 1, 1, 1, - 1, 0.1, 100)