Signatur
Beschreibung
Die schreibgeschützte Eigenschaft x eines Accelerometer-Objekts liefert die zuletzt gemessene Beschleunigung entlang der x-Achse des Geräts in Metern pro Sekunde zum Quadrat (m/s²). Bei einem Smartphone im Hochformat verläuft die x-Achse horizontal von links nach rechts über das Display. Ein positiver Wert bedeutet eine Beschleunigung nach rechts.
Der Wert enthält die Erdbeschleunigung (ca. 9,81 m/s²). Liegt das Gerät flach auf dem Tisch, ist x ungefähr 0. Kippt man es seitlich, geht ein Teil der Schwerkraft auf die x-Achse über. Deshalb eignet sich x gut, um die Neigung zu erkennen, etwa für Wasserwaagen, Steuerung durch Kippen in Spielen oder Schüttelgesten. Wer nur die Bewegung des Nutzers ohne Schwerkraft braucht, nimmt LinearAccelerationSensor. Für die reine Schwerkraft gibt es GravitySensor.
Solange der Sensor nicht mit start() gestartet wurde oder noch keine Messung vorliegt, ist x null. Neue Werte liest man am besten im reading-Event. Das Achsensystem folgt standardmäßig dem Gerät. Mit der Konstruktoroption referenceFrame: "screen" richtet es sich stattdessen nach der aktuellen Bildschirmausrichtung.
Rückgabewert
null, wenn noch keine Messung vorliegt.Beispiele
x-Beschleunigung fortlaufend auslesen
if ('Accelerometer' in window) {
const sensor = new Accelerometer({ frequency: 30 });
sensor.addEventListener('reading', () => {
console.log(`x: ${sensor.x.toFixed(2)} m/s²`);
});
sensor.addEventListener('error', (event) => {
console.error('Sensorfehler:', event.error.name, event.error.message);
});
console.log('Vor dem Start:', sensor.x); // null
sensor.start();
} else {
console.warn('Accelerometer wird nicht unterstützt.');
}Seitliche Neigung für eine Kippsteuerung
const ball = document.querySelector('#ball');
let position = window.innerWidth / 2;
const sensor = new Accelerometer({ frequency: 60, referenceFrame: 'screen' });
sensor.onreading = () => {
// Kippt man nach rechts, wird x negativ, weil die Schwerkraft nach links zieht
position -= sensor.x * 2;
position = Math.max(0, Math.min(window.innerWidth - 40, position));
ball.style.transform = `translateX(${position}px)`;
};
sensor.start();Schüttelgeste über die x-Achse erkennen
const startShakeDetection = async (onShake) => {
const { state } = await navigator.permissions.query({ name: 'accelerometer' });
if (state === 'denied') {
console.warn('Zugriff auf den Beschleunigungssensor verweigert.');
return;
}
const sensor = new Accelerometer({ frequency: 50 });
let lastX = null;
const threshold = 15; // m/s² Differenz zwischen zwei Messungen
sensor.addEventListener('reading', () => {
if (lastX !== null && Math.abs(sensor.x - lastX) > threshold) {
onShake();
}
lastX = sensor.x;
});
sensor.start();
return () => sensor.stop();
};
const stop = await startShakeDetection(() => console.log('Geschüttelt!'));// Wichtig · Fallstricke
- Browserunterstützung: Die Eigenschaft ist nur in Chromium-basierten Browsern verfügbar (Chrome, Edge, Opera, Samsung Internet). Firefox und Safari unterstützen die Generic Sensor API nicht. Als Ausweichlösung dient das
devicemotion-Event mitevent.accelerationIncludingGravity.x. Vorher sollte man die Unterstützung mit'Accelerometer' in windowprüfen. - Sicherer Kontext: Der Sensor funktioniert nur über HTTPS und nur, wenn die Permissions-Policy
accelerometerihn erlaubt. In iframes muss er mitallow="accelerometer"freigegeben werden. - null-Werte: Vor dem ersten
reading-Event und nachstop()istxnull. Rechnungen wiesensor.x.toFixed()lösen dann einenTypeErroraus. - Schwerkraft ist enthalten: Zur Bewegungserkennung ohne Schwerkraft eignet sich
LinearAccelerationSensorbesser. - Datenschutz und Genauigkeit: Browser können Frequenz und Genauigkeit der Messwerte drosseln, um Fingerprinting und Seitenkanalangriffe (z. B. das Mitlesen von Tastatureingaben) zu verhindern. In Hintergrund-Tabs werden keine Messwerte geliefert.
- Akku: Hohe Frequenzen verbrauchen Energie. Den Sensor mit
stop()beenden, wenn er nicht mehr gebraucht wird.