VueUse
Device Motion: 
acceleration:
  x: null
  'y': null
  z: null
accelerationIncludingGravity:
  x: null
  'y': null
  z: null
rotationRate:
  alpha: null
  beta: null
  gamma: null
interval: 0

useDeviceMotion

Reactive DeviceMotionEvent. Provide web developers with information about the speed of changes for the device's position and orientation.

Usage

import { useDeviceMotion } from '@vueuse/core'

const {
  acceleration,
  accelerationIncludingGravity,
  rotationRate,
  interval,
} = useDeviceMotion()
StateTypeDescription
accelerationobjectAn object giving the acceleration of the device on the three axis X, Y and Z.
accelerationIncludingGravityobjectAn object giving the acceleration of the device on the three axis X, Y and Z with the effect of gravity.
rotationRateobjectAn object giving the rate of change of the device's orientation on the three orientation axis alpha, beta and gamma.
intervalNumberA number representing the interval of time, in milliseconds, at which data is obtained from the device..

You can find more information about the state on the MDN.

Type Declarations

interface DeviceMotionOptions
  extends ConfigurableWindow,
    ConfigurableEventFilter {}
/**
 * Reactive DeviceMotionEvent.
 *
 * @see /useDeviceMotion
 * @param options
 */
export declare function useDeviceMotion(
  options?: DeviceMotionOptions
): {
  acceleration: Ref<DeviceMotionEventAcceleration | null>
  accelerationIncludingGravity: Ref<DeviceMotionEventAcceleration | null>
  rotationRate: Ref<DeviceMotionEventRotationRate | null>
  interval: Ref<number>
}
export {}

Source

Source • Demo • Docs