three.js 的camera简介
libai 发布于 2024-08-22

1、ArrayCamera

ArrayCamera可用于使用预定义的一组相机高效渲染场景。这是渲染VR场景的一个重要性能方面。

ArrayCamera的实例总是有一个子相机阵列。必须为每个子摄影机定义视口属性,该属性决定了使用此摄影机渲染的视口部分。

2、CubeCamera

创建6个渲染到WebGLCubeRenderTarget的摄影机。

Code Example

// Create cube render target
const cubeRenderTarget = new THREE.WebGLCubeRenderTarget( 128, { generateMipmaps: true, minFilter: THREE.LinearMipmapLinearFilter } );

// Create cube camera
const cubeCamera = new THREE.CubeCamera( 1, 100000, cubeRenderTarget );
scene.add( cubeCamera );

// Create car
const chromeMaterial = new THREE.MeshLambertMaterial( { color: 0xffffff, envMap: cubeRenderTarget.texture } );
const car = new THREE.Mesh( carGeometry, chromeMaterial );
scene.add( car );

// Update the render target cube
car.visible = false;
cubeCamera.position.copy( car.position );
cubeCamera.update( renderer, scene );

// Render the scene
car.visible = true;
renderer.render( scene, camera );

3、OrthographicCamera

使用正交投影的相机。

在此投影模式下,渲染图像中对象的大小保持不变,而不管其与相机的距离如何。

这对于渲染2D场景和UI元素等非常有用。

Code Example

const camera = new THREE.OrthographicCamera( width / - 2, width / 2, height / 2, height / - 2, 1, 1000 );
scene.add( camera );

4、PerspectiveCamera

使用透视投影的相机。

这种投影模式旨在模仿人眼的视觉方式。这是用于渲染3D场景的最常见的投影模式。

Code Example

const camera = new THREE.PerspectiveCamera( 45, width / height, 1, 1000 );
scene.add( camera );

5、StereoCamera

双透视相机用于3D立体轮廓或视差屏障等效果。

Properties

.aspect : Float

默认 1.

.eyeSep : Float

默认 0.064.

.cameraL : PerspectiveCamera

左摄像头。这将添加到层1中——左摄影机要渲染的对象也必须添加到此层中。

.cameraR : PerspectiveCamera

右摄像头。这将被添加到第2层——右摄影机要渲染的对象也必须添加到该层。

Methods

.update ( camera : PerspectiveCamera ) : undefined

根据传入的摄影机更新立体摄影机。

 

李白
关注 私信
文章
12
关注
0
粉丝
0