yomotsu/camera-controls

O que é?

Recursos principais

• 01Transições animadas suaves para setLookAt, fitToBox, rotateTo e métodos semelhantes, com suporte a Promise.
• 02Controles de órbita, dolly e truck, com mapeamento configurável para mouse e toque.
• 03Detecção de colisão com meshes e limites de movimento para o alvo da câmera.
• 04Suporte a câmeras em perspectiva e ortográficas.
• 05Eventos como rest e sleep para reagir quando o movimento parar.

Casos de uso

• Criar visualizadores interativos de produtos em 3D que vão até vistas específicas ou ajustam um objeto à tela.
• Adicionar tours de câmera ou sequências cinematográficas roteirizadas, encadeadas com await.
• Criar navegação no estilo primeira ou terceira pessoa em uma cena do three.js, com verificação de colisões.

Início rápido

1. 1

   Instale three.js, que é necessário para o camera-controls; o README não fornece um comando de instalação para nenhum dos dois pacotes

2. 2

   Importe a biblioteca e registre THREE com CameraControls.install antes de criar uma instância

3. 3

   Crie uma instância de CameraControls com sua câmera e o elemento DOM e, em seguida, chame update(delta) no loop de animação

Antes de usar

• !É necessário instalar three.js separadamente e registrá-lo com CameraControls.install; caso contrário, ocorrerão erros em tempo de execução.
• !O uso de colliderMeshes pode reduzir o desempenho, pois os testes de colisão usam raycasters a cada frame.

Tópicos

Perguntas frequentes

O que é camera-controls?

Biblioteca de controles de câmera para three.js que oferece transições suaves e mais recursos além da navegação orbital no estilo OrbitControls. camera-controls é uma biblioteca TypeScript para controlar uma câmera do three.js com interações de rotação orbital, dolly e truck (pan), semelhante em proposta ao THREE.OrbitControls. Seu principal diferencial são as transições animadas: chamadas como setLookAt, fitToBox ou rotateTo movem a câmera suavemente ao longo do tempo, e esses métodos retornam Promises para que as transições possam ser encadeadas com await.

camera-controls é gratuito? Qual é a licença?

camera-controls é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.

camera-controls ainda é mantido?

Manutenção ativa. O último commit de camera-controls foi em 21 de out. de 2026.

Para que posso usar camera-controls?

Criar visualizadores interativos de produtos em 3D que vão até vistas específicas ou ajustam um objeto à tela. Adicionar tours de câmera ou sequências cinematográficas roteirizadas, encadeadas com await. Criar navegação no estilo primeira ou terceira pessoa em uma cena do three.js, com verificação de colisões.

Como instalar camera-controls?

Instale three.js, que é necessário para o camera-controls; o README não fornece um comando de instalação para nenhum dos dois pacotes Importe a biblioteca e registre THREE com CameraControls.install antes de criar uma instância Crie uma instância de CameraControls com sua câmera e o elemento DOM e, em seguida, chame update(delta) no loop de animação

Onde consigo camera-controls?

O código-fonte e as instruções de instalação estão no GitHub: https://github.com/yomotsu/camera-controls