Start · Sprachen · JavaScript · Referenz · new DeviceMotionEvent()

new DeviceMotionEvent()

Methode

Erzeugt ein neues <code>DeviceMotionEvent</code>-Objekt, das Beschleunigungs- und Drehratendaten eines Geräts beschreibt. Nützlich vor allem für Tests und Simulationen.

seit JavaScript Baseline: Chrome 31+, Firefox 6+, Safari (iOS) 4.2 Kategorie: webapi

Signatur

new DeviceMotionEvent(type, options)

Beschreibung

Der Konstruktor DeviceMotionEvent() erzeugt ein synthetisches Bewegungsereignis. Normalerweise feuert der Browser devicemotion-Ereignisse selbst in regelmäßigen Abständen auf window, sobald Beschleunigungssensor und Gyroskop Daten liefern. Den Konstruktor brauchen Sie deshalb meist nur, wenn Sie solche Ereignisse selbst erzeugen wollen – etwa für Unit-Tests, für Desktop-Simulationen ohne Sensor oder für eine Demo-Funktion.

Im Objekt options geben Sie die Beschleunigung ohne Schwerkraft (acceleration), die Beschleunigung mit Schwerkraft (accelerationIncludingGravity), die Drehrate (rotationRate) und das Messintervall (interval) an. Beschleunigungen werden in m/s² angegeben, Drehraten in Grad pro Sekunde, das Intervall in Millisekunden.

Das erzeugte Ereignis verschicken Sie mit window.dispatchEvent(). Alle registrierten devicemotion-Listener und auch window.ondevicemotion reagieren darauf genauso wie auf echte Sensordaten. Allerdings ist event.isTrusted bei synthetischen Ereignissen false.

Parameter

Name Typ Default Beschreibung
$type Pflicht string Name des Ereignisses, üblicherweise "devicemotion".
$options object {} Optionales Wörterbuch (erbt von EventInit, also auch bubbles, cancelable, composed) mit folgenden Feldern:
  • acceleration: {x, y, z} in m/s² ohne Schwerkraft, Standard null-Werte
  • accelerationIncludingGravity: {x, y, z} in m/s² inklusive Schwerkraft
  • rotationRate: {alpha, beta, gamma} in °/s
  • interval: Messintervall in ms (number), Standard 0

Rückgabewert

Typ
DeviceMotionEvent
Beschreibung
Ein neues DeviceMotionEvent-Objekt mit den übergebenen Werten in acceleration, accelerationIncludingGravity, rotationRate und interval.

Beispiele

Ereignis erzeugen und Werte auslesen

const event = new DeviceMotionEvent('devicemotion', {
  acceleration: { x: 0.5, y: 0, z: 0.1 },
  accelerationIncludingGravity: { x: 0.5, y: 0, z: 9.91 },
  rotationRate: { alpha: 10, beta: 0, gamma: 0 },
  interval: 16
});

console.log(event.type);
console.log(event.acceleration.x);
console.log(event.accelerationIncludingGravity.z);
console.log(event.interval);
devicemotion 0.5 9.91 16

Schüttel-Erkennung ohne echtes Gerät testen

const SHAKE_THRESHOLD = 15; // m/s²

const onMotion = (e) => {
  const { x, y, z } = e.accelerationIncludingGravity;
  const magnitude = Math.hypot(x ?? 0, y ?? 0, z ?? 0);
  if (magnitude > SHAKE_THRESHOLD) {
    console.log(`Schütteln erkannt (${magnitude.toFixed(1)} m/s²)`);
  }
};

window.addEventListener('devicemotion', onMotion);

// Simuliertes kräftiges Schütteln
window.dispatchEvent(new DeviceMotionEvent('devicemotion', {
  accelerationIncludingGravity: { x: 12, y: 8, z: 9.81 },
  interval: 16
}));

window.removeEventListener('devicemotion', onMotion);
Schütteln erkannt (17.5 m/s²)

Sensor-Fallback: echte Daten oder Simulation

const startMotion = async () => {
  // iOS 13+: Berechtigung nur nach Nutzergeste anfragbar
  if (typeof DeviceMotionEvent.requestPermission === 'function') {
    const state = await DeviceMotionEvent.requestPermission();
    if (state !== 'granted') return simulate();
  }
  window.ondevicemotion = (e) => console.log('Rotation alpha:', e.rotationRate?.alpha);
};

const simulate = () => {
  window.ondevicemotion = (e) => console.log('Simuliert alpha:', e.rotationRate.alpha);
  let t = 0;
  const id = setInterval(() => {
    window.dispatchEvent(new DeviceMotionEvent('devicemotion', {
      rotationRate: { alpha: Math.sin(t += 0.5) * 90, beta: 0, gamma: 0 },
      interval: 100
    }));
    if (t > 2) clearInterval(id);
  }, 100);
};

document.querySelector('#start')?.addEventListener('click', startMotion);

// Wichtig · Fallstricke

  • Synthetische Ereignisse haben isTrusted === false. Den Konstruktor aufzurufen, erzeugt keine echten Sensordaten und gibt auch keinen Zugriff auf die Hardware.
  • Echte devicemotion-Ereignisse gibt es nur in einem sicheren Kontext (HTTPS). Unter iOS Safari 13+ muss man vorher DeviceMotionEvent.requestPermission() nach einer Nutzergeste aufrufen. Über die Permissions Policy (accelerometer, gyroscope) lässt sich der Zugriff in iframes sperren.
  • Nicht übergebene Achsen haben den Wert null. Prüfen Sie das in Ihren Handlern ab, zum Beispiel mit ?? 0. Viele Desktop-Browser liefern überhaupt keine echten Ereignisse.
  • Die Achsen richten sich nach dem Koordinatensystem des Geräts, nicht nach der Ausrichtung des Bildschirms. Beim Drehen ins Querformat müssen Sie die Werte eventuell selbst umrechnen.
  • Der Datenschutz spielt hier eine Rolle: Bewegungsdaten können für Fingerprinting missbraucht werden. Manche Browser runden die Werte deshalb oder drosseln die Frequenz.