Signatur
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:
|
Rückgabewert
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);
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);
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 vorherDeviceMotionEvent.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.