Что такое гироскоп?

Гироскоп — это крошечный датчик в вашем телефоне, планшете или ноутбуке, который измеряет вращение по трём осям. В сочетании с акселерометром и магнитометром он сообщает устройству, в какую сторону оно наклонено, с какой скоростью оно вращается и в каком направлении оно ориентировано. Эти данные обеспечивают автоматический поворот экрана, дополненную реальность, гоночные игры, панорамные фотографии, подсчёт шагов и стабилизацию изображения.

Современные устройства предоставляют эту информацию веб-браузерам через API DeviceOrientationEvent. Браузер сообщает три угла — alpha, beta и gamma — которые вместе описывают ориентацию устройства в трёхмерном пространстве относительно Земли.

Понимание alpha, beta и gamma

Три угла ориентации каждый описывают вращение вокруг разной оси:

  • Alpha (0–360°) — Вращение вокруг оси Z (вертикальная). Представьте, что вы вращаете устройство, лежащее на столе; alpha — это направление, как на компасе.
  • Beta (-180–180°) — Вращение вокруг оси X (слева направо). Это наклон спереди назад, как если бы вы кивали устройством в вашу сторону или от вас.
  • Gamma (-90–90°) — Вращение вокруг оси Y (сверху вниз). Это наклон слева направо, как если бы вы наклоняли устройство в сторону.

Описание инструмента

Этот инструмент читает данные живой ориентации с гироскопа вашего устройства и отображает их как трёхмерную модель, которая зеркально отражает ваши движения в реальном времени. Он также показывает необработанные значения alpha, beta и gamma в градусах, чтобы вы могли проверить, что датчик работает правильно и выдаёт точные показания.

Примеры

Положение устройства Alpha Beta Gamma
Лежит плоско, экран вверх, верх на С 0° 0° 0°
Держится вертикально в портретном режиме 0° 90° 0°
Наклонено правым краем вниз (ландшафт) 0° 0° 90°
Повёрнуто на 180° плоско, экран всё ещё вверх 180° 0° 0°

Возможности

  • Живая трёхмерная модель, которая вращается синхронно с вашим устройством
  • Показания alpha, beta и gamma в реальном времени в градусах
  • Определяет, поддерживает ли браузер API ориентации
  • Обрабатывает запросы разрешений iOS для доступа к датчикам движения
  • Показывает, являются ли данные ориентации абсолютными (привязанными к Земле) или относительными

Варианты использования

  • Диагностика неисправного датчика — Проверьте, работает ли гироскоп вашего телефона правильно, прежде чем отправлять его на ремонт или возвращать.
  • Тестирование веб-приложений, использующих движение — Разработчики, создающие AR-опыт, игры с управлением движением или предпросмотры VR, могут проверить входные данные датчика прямо в браузере.
  • Проверка калибровки — Убедитесь, что значения ориентации возвращаются к нулю, когда устройство лежит плоско, помогая вам обнаружить дрейф или неправильную калибровку.

Как это работает

Инструмент подписывается на событие deviceorientation браузера, которое срабатывает всякий раз, когда ориентация вашего устройства изменяется. Каждое событие предоставляет текущие значения alpha, beta и gamma. Трёхмерная модель использует Three.js для преобразования этих углов в кватернион вращения, применяемый с плавной интерполяцией на каждом кадре анимации, чтобы избежать дрожания.

Ограничения

  • Требует устройство со встроенным гироскопом (большинство настольных компьютеров и многие ноутбуки его не имеют)
  • iOS Safari требует явного разрешения через жест пользователя перед тем, как данные датчика будут переданы
  • Требует защищённый контекст (HTTPS) на большинстве современных браузеров
  • Некоторые браузеры сообщают ориентацию только когда страница находится на переднем плане

Советы

  • Если показания остаются на нуле, ваше устройство, вероятно, не имеет гироскопа или браузер блокирует доступ
  • На iOS нажмите кнопку «Включить движение» после загрузки страницы — разрешение не может быть предоставлено автоматически
  • Положите устройство плоско на стабильную поверхность, чтобы подтвердить базовые значения перед тестированием наклонов