Javascript Three.js中的摄影机参数

以下是摄影机的实例化方式：

var camera = new THREE.PerspectiveCamera(
    VIEW_ANGLE,
    ASPECT,
    NEAR,
    FAR
);

---

这些值意味着什么？

第一个参数是FOV表示视野，想象一下三脚架上的相机，如果将镜头更改为广角，则会获得更高的FOV。试着想象一个圆锥体从相机里出来，它只能看到那个区域的物体

---

纵横比是指纵横比，一台宽屏电视是16/9，旧的是4/3，通常只给它屏幕的宽度/高度或你想用three.js的DIV的昏暗度。

我想知道同样的事情，所以我查了一下，它是一个视图“平台”

我将在这里粘贴我在最近一个项目中编写的代码注释，因为它很好地总结了IMHO

// "What the f*** is a frustum?" you ask. Well I did.
// Think about it as a truncated pyramid. The tip is the camera. From a certain
// point "down" the pyramid (the "near plane"), stuff can be seen on-screen.
// After the "base" of the pyramid (the "far plane"), stuff is too far to be
// seen. Stuff outside the pyramid is off-screen too. There is also the "aspect
// ratio" (the rectangle that makes up the pyramid's base, so this value is
// width/height) and the "field of view" (think of it as a lens or something,
// it distorts the pyramid so there's more objects on screen - it is set in
// degrees and 45° is more-or-less a "natural" perspective. The bigger the
// number, the more "perspective" there is).

我发现这对于理解所有相机参数以及和之间的差异非常有用

透视照相机

• Fov（视野）-这是可以从相机位置看到的场景的一部分。你可能知道，我们人类几乎有180度的视野，而有些鸟类甚至有360度的视野。然而，对于计算机，我们通常使用60到90度的视野

• 纵横比-纵横比是渲染输出区域的水平和垂直大小之间的比率。因为我们通常使用整个窗口，所以我们只使用这个比率。纵横比决定了水平视野和垂直视野之间的差异，如下图所示。普通值为

  window.innerWidth/window.innerHeight

• Near-此属性定义与摄影机的最小距离

  Three.js

  渲染场景。通常，这是一个非常小的值，例如0.1

• 远-此属性定义我们从摄影机位置看到场景的最大距离。如果我们将其设置得太低，场景的一部分可能无法渲染；如果将其设置得太高，在某些情况下，可能会影响渲染性能。正常值介于500和2000之间

正交摄影机

• 左（摄影机截锥体左平面）-您应该将其视为将渲染的对象的左边界。如果我们将此值设置为-100，您将看不到离左侧更远的任何对象

• 右侧（摄影机视锥台右侧平面）-右侧更远的任何对象都不会被渲染

• 顶部（摄影机平截头体顶平面）-要渲染的最大顶部位置

• 底部（摄影机平截头体底部平面）要渲染的底部位置

• 近（摄影机平截头体近平面）-从这一点开始，基于摄影机的位置，场景将被渲染

• 远（摄影机平截体远平面）-基于摄影机位置的场景将渲染到的最远点

下面的图片应该非常具有说明性：

两种摄影机模式之间的主要区别在于，在正交摄影机中，距离不起作用，因此所有元素的大小都相同，正如您在红色和黄色球的情况中所看到的那样

最后，以下是一些代码，可用于从一个摄像头切换到另一个摄像头：

this.switchCamera = function(SCENE_WIDTH, SCENE_HEIGHT) {
  if (camera instanceof THREE.PerspectiveCamera) {
    camera = new THREE.OrthographicCamera( SCENE_WIDTH / - 2, SCENE_WIDTH / 2, SCENE_HEIGHT / 2, SCENE_HEIGHT / - 2, 0.1, 1000 );
    camera.position.x = 0;
    camera.position.y = 0;
    camera.position.z = -1;
    camera.lookAt(scene.position);
    this.perspective = "Orthographic";
  } else {
    camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 1000 );
    camera.position.x = 0;
    camera.position.y = 0;
    camera.position.z = -1;
    camera.lookAt(scene.position);
    this.perspective = "Perspective";
  }
};

注意事项：

• 功能

  camera.lookAt（scene.position）

  将摄影机定向到场景所在的位置，使其可见

• three.js中的单位是，因此
  左、右、上、下的值不应假定为像素

• 相机平截头体的纵横比通常应与画布的纵横比匹配

• 场景宽度和场景高度可以通过添加到场景中的几何体来确定。正交平截头体可能比场景大很多，但也不会很节省
  

有用的链接：

---

视野：相机平截头体垂直视野

纵横比：相机截锥体纵横比

近：摄影机平截头体近平面

远：相机截锥远平面

在这些页面上有一些FOV、近平面和远平面的图像

这是纵横比

这是官方文件

---

请参考我在您最近的问题上给出的答案——这是近剪裁平面和远剪裁平面——这很酷，现在，还有其他值吗？：）碰撞究竟什么是远近？我假设（zFAR）意味着它不会显示在屏幕上，但这只是一个假设。就装载速度而言，远的问题是可以理解的，但近的问题？剪辑问题lol？我想你需要阅读并更正你的帖子。（1）你正在将像素单位传递给你的

正交摄影机

构造器。单位应为世界单位。（2） 您的近剪裁平面位于相机后面，因为您为

近

指定了负值。否，这是不正确的。我建议您更改它，以免误导用户。另外，三个.js r.76单元是任意的。它们不需要使用国际单位制。所有建议的更正现已合并！谢谢你的反馈。