three.js(Câmera)

Tipo de câmera:
1. Câmera de perspectiva (PerspectiveCamera): A câmera de perspectiva simula o efeito de olhos humanos observando objetos e tem o efeito de profundidade de campo que é distante e pequeno. Para criar uma câmera em perspectiva, você precisa definir parâmetros como FOV, taxa de proporção da tela, plano próximo e distância do plano distante.
2 Câmera Ortográfica (OrthographicCamera): A câmera ortogonal elimina o efeito de perspectiva e faz com que o objeto apareça do mesmo tamanho na tela. A criação de uma câmera ortogonal requer a definição das posições dos planos de recorte esquerdo e direito, superior e inferior e frontal e posterior.
3 Cube Camera (CubeCamera): Uma câmera de cubo é uma câmera especial que captura o ambiente circundante, gera um mapa de cubo e o aplica ao material. É comumente usado para efeitos de reflexão e refração, como reflexões especulares e refração em superfícies de vidro.
Perspective Camera (PerspectiveCamera)
construtor
PerspectiveCamera (campo de visão vertical do tronco de visualização da câmera, ângulo de aspecto do tronco de visualização da câmera, face proximal do tronco de visualização da câmera, face distante do tronco de visualização da
câmera
)
. usando a largura/altura da tela. O padrão é 1 (tela quadrada).

.far: Flutuante
●A face mais distante da câmera, o valor padrão é 2000. Este valor deve ser maior que o valor do plano próximo (a face próxima do tronco da câmera).

.filmGauge : Flutuante
●Tamanho do filme, o valor padrão é 35 (mm). Este parâmetro não afeta a matriz de projeção da câmera, a menos que .filmOffset seja definido como um valor diferente de zero.

.filmOffset : Flutuante
●O deslocamento horizontal do centro, a mesma unidade que .filmGauge. O valor padrão é 0.

.foco: Flutuar
● Distância de objetos para efeitos de estereopsia e profundidade de campo. Este parâmetro não afeta a matriz de projeção da câmera, a menos que uma StereoCamera seja usada. O valor padrão é 10.

.fov : Flutuante
●O ângulo de visão vertical do tronco da câmera, expresso em ângulos de baixo para cima na visualização. O valor padrão é 50.

.isPerspectiveCamera : Booleano
● Sinalizador somente leitura para verificar se o objeto fornecido é do tipo câmera em perspectiva.

.near : Float
●A face próxima da câmera, o valor padrão é 0,1.
●A faixa de valor efetivo está entre 0 e o valor do plano distante da câmera atual (plano distante). Observe que, ao contrário de OrthographicCamera, 0 não é um valor válido para a face próxima de PerspectiveCamera.

.view : Object
●Ver especificação da janela frustum. Esse valor é definido usando o método .setViewOffset e limpo usando o método .clearViewOffset.

.zoom : número
● Obtenha ou defina o fator de zoom da câmera, o valor padrão é 1.
Método
.clearViewOffset (): indefinido
● Limpa qualquer deslocamento definido por .setViewOffset.

.getEffectiveFOV (): Float
●Combinado com .zoom (fator de zoom), retorna o campo de visão vertical atual, ângulo por ângulo.

.getFilmHeight (): Flutuar
●Retorna a altura da imagem no filme atual, se .aspect for menor ou igual a 1 (formato retrato, composição retrato), o resultado é igual a .filmGauge.

.getFilmWidth (): Float
●Retorna a largura da imagem no filme atual.Se .aspect for maior ou igual a 1 (formato de paisagem, composição de paisagem), o resultado é igual a .filmGauge.

.getFocalLength (): Float
●Retorna a distância focal do .fov (ângulo de visão) atual em relação a .filmGauge (tamanho do filme).

.setFocalLength ( focalLength : Float ): indefinido
●Define o FOV pela distância focal relativa ao .filmGauge atual.
●Por padrão, a distância focal é especificada para uma câmera de 35 mm (quadro completo).
Orthographic Camera (OrthographicCamera)
construtor
OrthographicCamera (lado esquerdo do tronco da câmera, lado direito do tronco da câmera, lado superior do tronco da câmera, lado inferior do tronco da câmera, perto da extremidade do tronco da câmera, vista da extremidade oposta do tronco da
câmera
)
. O lado inferior do tronco de visualização da câmera.

.far: Flutuante
● Face distante do frustum da câmera, o valor padrão é 2000. Este valor deve ser maior que o valor do plano próximo (a face próxima do tronco da câmera).

.isOrthographicCamera : Booleano
● Sinalizador somente leitura usado para verificar se um determinado objeto é um tipo de câmera ortogonal.

.esquerda: Flutuar
●O lado esquerdo do frustum de visualização da câmera.

.near : Float
●A face próxima da extremidade do frustum de visualização da câmera. Seu valor padrão é 0,1
●A faixa válida de seu valor é entre 0 e distante (face distante do frustum da câmera).
●Observe que, ao contrário de PerspectiveCamera, 0 é um valor válido para a face próxima de OrthographicCamera.

.right: Flutuar
●O lado direito do tronco da câmera.

.topo : Flutuante
●O lado superior do frustum de visualização da câmera.

.view : Object
●Este valor é definido por setViewOffset e seu valor padrão é nulo.

.zoom : número
● Obtenha ou defina o fator de zoom da câmera, o valor padrão é 1.

Method.setViewOffset
( fullWidth : Float, fullHeight : Float, x : Float, y : Float, width : Float, height : Float ): indefinido fullWidth
— Configuração de largura total de multivisualização
fullHeight — Configuração de altura total de multivisualização
x — Câmera secundária Deslocamento horizontal
y — o deslocamento vertical da câmera secundária
largura — a largura da câmera secundária
altura — a altura da câmera secundária

. clearViewOffset (): indefinido
● Limpa qualquer deslocamento definido por .setViewOffset.

.updateProjectionMatrix (): indefinido
●Atualiza a matriz de projeção da câmera. Deve ser chamado após qualquer parâmetro ter sido alterado.

.toJSON (meta : Object): Object
meta -- um objeto que contém metadados, como texturas ou imagens em descendentes de objeto
Converte a câmera para o formato three.js JSON Object/Scene (three.js JSON object/scene format ).
CubeCamera (CubeCamera)
Construtor
CubeCamera (a distância do plano de recorte próximo, a distância do plano de recorte distante, o destino de renderização do cubo de destino.)
property.renderTarget
: WebGLCubeRenderTarget
destino de renderização do cubo de destino. (O destino que você deseja exibir)
Method.update
( renderizador : WebGLRenderer, cena : cena ) : renderizador indefinido
-- a
cena atual do renderizador WebGL -- a cena atual
A posição da câmera e a posição em relação
à câmera podem ser definidas por camera.position.set (x, y, z) para definir, onde x, y, z representam a posição da câmera nos três eixos de coordenadas, respectivamente. A orientação da câmera pode ser definida pelo método camera.lookAt(target), onde target é um objeto Vector3 que representa o ponto alvo para o qual a câmera é apontada.

Código de amostra:

const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

// 设置相机位置

camera.position.set(0, 0, 10);

// 设置相机朝向

const target = new THREE.Vector3(0, 0, 0);

camera.lookAt(target);

O código acima criará uma câmera em perspectiva, definirá sua posição como (0, 0, 10) e, em seguida, definirá sua orientação para a origem (0, 0, 0).
Controlador de lente
1OrbitControls: usado para girar a lente, ampliar e deslocar a cena.
2FlyControls: Para simulação de voo, você pode controlar a posição e a direção da câmera.
3PointerLockControls: Usado para bloquear o ponteiro do mouse e controlar a câmera na cena.
4FirstPersonControls: Usado para perspectiva em primeira pessoa, movendo e girando a câmera na cena.
Aqui está o código para usar o controlador de lente OrbitControls:

Código de amostra

// 实例化 OrbitControlsconst

controls = new THREE.OrbitControls(camera, renderer.domElement);

// 设置控制器参数

controls.enableDamping = true; // 启用阻尼效果

controls.dampingFactor = 0.05; // 阻尼系数

controls.rotateSpeed = 0.1; // 旋转速度

controls.zoomSpeed = 0.5; // 缩放速度

controls.panSpeed = 0.2; // 平移速度

// 渲染循环中更新控制器状态

function animate() {

requestAnimationFrame(animate);

controls.update(); // 更新控制器状态

renderer.render(scene, camera);

}

animate();

Isso permite que você use o controlador de câmera OrbitControls para controlar a câmera na cena

Acho que você gosta

Origin blog.csdn.net/w418856/article/details/130843955
Recomendado
Clasificación