yomotsu/camera-controls

Что это?

Ключевые возможности

• 01Плавные анимированные переходы для setLookAt, fitToBox, rotateTo и подобных методов с поддержкой Promise.
• 02Орбитальное управление, приближение и отдаление, а также перемещение с настройкой сопоставления кнопок мыши и касаний.
• 03Обнаружение столкновений с мешами и ограничения границ для цели камеры.
• 04Поддержка перспективных и ортографических камер.
• 05События, например rest и sleep, для реакции на остановку движения.

Сценарии использования

• Создание интерактивных 3D-витрин товаров с переходом к заданным ракурсам или подгонкой объекта под размер экрана.
• Добавление туров по сцене или постановочных кинематографичных последовательностей с объединением переходов через await.
• Создание навигации от первого или третьего лица в сцене three.js с проверкой столкновений.

Быстрый старт

1. 1

   Установите three.js, необходимый для camera-controls; в README нет команды установки ни для одного из пакетов

2. 2

   Импортируйте библиотеку и зарегистрируйте THREE с помощью CameraControls.install до создания экземпляра

3. 3

   Создайте экземпляр CameraControls, передав ему камеру и DOM-элемент, а затем вызывайте update(delta) в цикле анимации

Что важно знать

• !Необходимо отдельно установить three.js и зарегистрировать его с помощью CameraControls.install, иначе возникнут ошибки во время выполнения.
• !Использование colliderMeshes может снизить производительность, поскольку при проверке столкновений raycaster используется каждый кадр.

Темы

Частые вопросы

Что такое camera-controls?

Библиотека управления камерой для three.js с плавными переходами и расширенными возможностями орбитального управления в стиле OrbitControls. camera-controls — библиотека на TypeScript для управления камерой three.js с помощью орбитального вращения, приближения и отдаления (dolly), а также перемещения (truck, или pan), по духу похожая на THREE.OrbitControls. Главное дополнение — анимированные переходы: вызовы setLookAt, fitToBox и rotateTo плавно перемещают камеру за заданное время, а сами методы возвращают Promise, поэтому переходы можно объединять с помощью await.

camera-controls можно использовать бесплатно? Какая у него лицензия?

camera-controls распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.

camera-controls всё ещё поддерживается?

Активно поддерживается. Последний коммит в camera-controls — 21 окт. 2026 г..

Для чего можно использовать camera-controls?

Создание интерактивных 3D-витрин товаров с переходом к заданным ракурсам или подгонкой объекта под размер экрана. Добавление туров по сцене или постановочных кинематографичных последовательностей с объединением переходов через await. Создание навигации от первого или третьего лица в сцене three.js с проверкой столкновений.

Как установить camera-controls?

Установите three.js, необходимый для camera-controls; в README нет команды установки ни для одного из пакетов Импортируйте библиотеку и зарегистрируйте THREE с помощью CameraControls.install до создания экземпляра Создайте экземпляр CameraControls, передав ему камеру и DOM-элемент, а затем вызывайте update(delta) в цикле анимации

Где скачать camera-controls?

Исходный код и инструкции по установке — на GitHub: https://github.com/yomotsu/camera-controls