isSupported: false
isAbsolute: false
alpha: null
beta: null
gamma: null
useDeviceOrientation
Reactive DeviceOrientationEvent. Provide web developers with information from the physical orientation of the device running the web page.
Usage
import { useDeviceOrientation } from '@vueuse/core'
const {
isAbsolute,
alpha,
beta,
gamma,
} = useDeviceOrientation()
State | Type | Description |
---|---|---|
isAbsolute | boolean | A boolean that indicates whether or not the device is providing orientation data absolutely. |
alpha | number | A number representing the motion of the device around the z axis, express in degrees with values ranging from 0 to 360. |
beta | number | A number representing the motion of the device around the x axis, express in degrees with values ranging from -180 to 180. |
gamma | number | A number representing the motion of the device around the y axis, express in degrees with values ranging from -90 to 90. |
You can find more information about the state on the MDN.
Type Declarations
/**
* Reactive DeviceOrientationEvent.
*
* @see {@link /useDeviceOrientation}
* @param options
*/
export declare function useDeviceOrientation(
options?: ConfigurableWindow
): {
isSupported: boolean
isAbsolute: Ref<boolean>
alpha: Ref<number | null>
beta: Ref<number | null>
gamma: Ref<number | null>
}