Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
The DeviceOrientationEvent interface of the Device Orientation Events provides web developers with information from the physical orientation of the device running the web page.
DeviceOrientationEvent.DeviceOrientationEvent()Creates a new DeviceOrientationEvent.
DeviceOrientationEvent.requestPermission()Requests the user's permission to access device orientation data. Returns a Promise that resolves with a string of "granted" or "denied".
DeviceOrientationEvent.absolute Read onlyA boolean that indicates whether or not the device is providing orientation data absolutely.
DeviceOrientationEvent.alpha Read onlyA number representing the motion of the device around the z axis, express in degrees with values ranging from 0 (inclusive) to 360 (exclusive).
DeviceOrientationEvent.beta Read onlyA number representing the motion of the device around the x axis, express in degrees with values ranging from -180 (inclusive) to 180 (exclusive). This represents a front to back motion of the device.
DeviceOrientationEvent.gamma Read onlyA number representing the motion of the device around the y axis, express in degrees with values ranging from -90 (inclusive) to 90 (exclusive). This represents a left to right motion of the device.
DeviceOrientationEvent.webkitCompassHeading Read onlyA number represents the difference between the motion of the device around the z axis of the world system and the direction of the north, express in degrees with values ranging from 0 to 360.
DeviceOrientationEvent.webkitCompassAccuracy Read onlyThe accuracy of the compass means that the deviation is positive or negative. It's usually 10.
window.addEventListener("deviceorientation", (event) => {
console.log(`${event.alpha} : ${event.beta} : ${event.gamma}`);
});