Window: событие deviceorientation

Базовая версия 2023

Новое

Начиная с сентября 2023 года, эта функция работает на последних версиях устройств и браузеров. Возможно, она не будет работать на старых устройствах или браузерах.

Защищённый контекст: Эта функция доступна только в защищённых контекстах (HTTPS), в некоторых или во всех поддерживающих браузерах.

Событие deviceorientation срабатывает, когда доступны свежие данные с датчика ориентации о текущей ориентации устройства относительно системы координат Земли. Эти данные собираются с помощью акселерометра и компаса внутри устройства.

Подробности см. в разделе Объяснение данных ориентации и движения.

Это событие не отменяется и не распространяется.

Синтаксис

Используйте имя события в методах, таких как addEventListener(), или задайте свойство обработчика событий.

addEventListener("deviceorientation", (event) => {});

ondeviceorientation = (event) => {};

Тип события

Объект DeviceOrientationEvent. Наследуется от Event.

Свойства события

DeviceOrientationEvent.absolute Только для чтения: Булево значение, указывающее, предоставляет ли устройство данные ориентации абсолютно.
DeviceOrientationEvent.alpha Только для чтения: Число, представляющее движение устройства вокруг оси z, выраженное в градусах со значениями от 0 (включительно) до 360 (исключительно).
DeviceOrientationEvent.beta Только для чтения: Число, представляющее движение устройства вокруг оси x, выраженное в градусах со значениями от -180 (включительно) до 180 (исключительно). Это представляет движение устройства вперёд и назад.
DeviceOrientationEvent.gamma Только для чтения: Число, представляющее движение устройства вокруг оси y, выраженное в градусах со значениями от -90 (включительно) до 90 (исключительно). Это представляет движение устройства влево и вправо.
DeviceOrientationEvent.webkitCompassHeading Нестандартный Только для чтения: Число, представляющее разницу между движением устройства вокруг оси z мировой системы координат и направлением на север, выраженное в градусах со значениями от 0 до 360.
DeviceOrientationEvent.webkitCompassAccuracy Нестандартный Только для чтения: Точность компаса, заданная как положительное или отрицательное отклонение. Обычно 10.

Примеры

if (window.DeviceOrientationEvent) {
  window.addEventListener(
    "deviceorientation",
    (event) => {
      const rotateDegrees = event.alpha; // alpha: rotation around z-axis
      const leftToRight = event.gamma; // gamma: left to right
      const frontToBack = event.beta; // beta: front back motion

      handleOrientationEvent(frontToBack, leftToRight, rotateDegrees);
    },
    true,
  );
}

const handleOrientationEvent = (frontToBack, leftToRight, rotateDegrees) => {
  // do something amazing
};

Спецификации

Спецификация
Ориентация и движение устройства # deviceorientation
Ориентация и движение устройства # ref-for-dom-window-ondeviceorientation

Совместимость браузеров

	Рабочие столы					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`deviceorientation_event`	7	12	63.6–6	12	17	18	64–6	12	4.2	1.0	3

См. также

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Window/deviceorientation_event