Start · Sprachen · JavaScript · Referenz · Accelerometer

Accelerometer

Schnittstelle

Das <code>Accelerometer</code>-Interface liefert bei jeder Messung die Beschleunigung des Geräts entlang der drei Achsen X, Y und Z in m/s².

seit JavaScript Generic Sensor API — Chromium-Browser (Chrome/Edge Kategorie: webapi

Signatur

interface Accelerometer extends Sensor

Beschreibung

Accelerometer gehört zur Generic Sensor API und erbt von Sensor (und damit von EventTarget). Das Interface misst die Beschleunigung des Geräts in Meter pro Sekunde zum Quadrat (m/s²) über die Eigenschaften x, y und z. Die Erdanziehung ist in den Werten enthalten: Ein flach auf dem Tisch liegendes Gerät meldet ungefähr z ≈ 9.81.

Nach dem Erzeugen mit new Accelerometer(options) startest du den Sensor mit start() und hältst ihn mit stop() an. Neue Messwerte kommen über das Ereignis reading (Eigenschaft onreading), Fehler über error (onerror), und die Bereitschaft wird über activate gemeldet. Geerbte Eigenschaften sind activated, hasReading und timestamp.

Typische Einsatzgebiete sind Schüttel-Erkennung, Schrittzähler, Neigungssteuerung in Spielen und Bewegungsanalyse. Brauchst du die Beschleunigung ohne Erdanziehung, nimm LinearAccelerationSensor. Brauchst du nur die Richtung der Schwerkraft, nimm GravitySensor. Beide sind Unterklassen von Accelerometer.

Die API funktioniert nur in einem sicheren Kontext (HTTPS). Der Zugriff wird über die Permissions-Policy accelerometer und die Berechtigung "accelerometer" in der Permissions API gesteuert.

Parameter

Name Typ Default Beschreibung
$options object {} Optionales Konfigurationsobjekt für den Konstruktor new Accelerometer(options).
$options.frequency number gerätespezifisch Gewünschte Anzahl der Messungen pro Sekunde (Hz). Die tatsächliche Rate kann niedriger sein, wenn die Hardware sie nicht schafft.
$options.referenceFrame "device" | "screen" "device" Bezugssystem der Achsen: "device" nutzt die physischen Geräteachsen, "screen" richtet sie an der aktuellen Bildschirmausrichtung aus.

Beispiele

Sensor erzeugen und Messwerte ausgeben

if ('Accelerometer' in window) {
  const acl = new Accelerometer({ frequency: 30 });

  acl.addEventListener('reading', () => {
    console.log(`x: ${acl.x.toFixed(2)}  y: ${acl.y.toFixed(2)}  z: ${acl.z.toFixed(2)}`);
  });

  acl.addEventListener('error', (event) => {
    console.error(event.error.name, event.error.message);
  });

  acl.start();
} else {
  console.warn('Accelerometer wird nicht unterstützt.');
}
x: 0.12 y: 0.05 z: 9.79 x: 0.10 y: 0.07 z: 9.81 …

Berechtigung prüfen und Fehler sauber behandeln

const startAccelerometer = async () => {
  const { state } = await navigator.permissions.query({ name: 'accelerometer' });
  if (state === 'denied') {
    console.warn('Zugriff auf den Beschleunigungssensor verweigert.');
    return null;
  }

  try {
    const acl = new Accelerometer({ frequency: 60, referenceFrame: 'screen' });
    acl.onerror = ({ error }) => {
      if (error.name === 'NotAllowedError') console.warn('Keine Berechtigung.');
      else if (error.name === 'NotReadableError') console.warn('Sensor nicht verfügbar.');
    };
    acl.onactivate = () => console.log('Sensor aktiv');
    acl.start();
    return acl;
  } catch (err) {
    // SecurityError (Permissions-Policy) oder ReferenceError (keine Unterstützung)
    console.error('Sensor konnte nicht erzeugt werden:', err.name);
    return null;
  }
};

startAccelerometer();
Sensor aktiv

Schüttel-Erkennung mit Aufräumen über removeEventListener

const acl = new Accelerometer({ frequency: 60 });
const THRESHOLD = 25; // m/s², deutlich über der Erdbeschleunigung
let lastShake = 0;

const onReading = () => {
  const magnitude = Math.hypot(acl.x, acl.y, acl.z);
  const now = performance.now();
  if (magnitude > THRESHOLD && now - lastShake > 1000) {
    lastShake = now;
    console.log('Gerät geschüttelt!', magnitude.toFixed(1));
  }
};

acl.addEventListener('reading', onReading);
acl.start();

// Sensor stoppen, wenn der Tab im Hintergrund ist – spart Akku
document.addEventListener('visibilitychange', () => {
  if (document.hidden) {
    acl.stop();
  } else {
    acl.start();
  }
});

// Endgültig abmelden, z. B. beim Verlassen der Ansicht
const cleanup = () => {
  acl.removeEventListener('reading', onReading);
  acl.stop();
};
Gerät geschüttelt! 31.4

// Wichtig · Fallstricke

  • Browser-Unterstützung: Nur Chromium-basierte Browser (Chrome, Edge, Opera, Samsung Internet) unterstützen die API. Firefox und Safari haben sie nicht. Prüfe deshalb vorher mit 'Accelerometer' in window. Als Ausweichlösung eignet sich das devicemotion-Ereignis (auf iOS braucht es DeviceMotionEvent.requestPermission()).
  • Sicherer Kontext: Die API gibt es nur unter HTTPS bzw. localhost. In iframes muss die Permissions-Policy sie erlauben: <iframe allow="accelerometer">. Sonst wirft der Konstruktor einen SecurityError.
  • Erdanziehung inklusive: Die Werte enthalten die Erdbeschleunigung (≈ 9,81 m/s²). Ohne sie verwendest du LinearAccelerationSensor.
  • Fehler kommen asynchron: Fehlende Berechtigung oder Hardware meldet sich erst nach start() über das error-Ereignis (NotAllowedError, NotReadableError), nicht als Exception. Registriere den Fehler-Handler deshalb immer.
  • Datenschutz und Akku: Browser begrenzen die Frequenz und liefern im Hintergrund oder in unsichtbaren Frames keine Messwerte, weil Bewegungsdaten Rückschlüsse auf Eingaben zulassen (z. B. Tastatur-Seitenkanäle). Stoppe den Sensor mit stop(), sobald du ihn nicht mehr brauchst.
  • Vor der ersten Messung sind x, y und z gleich null. Prüfe bei Bedarf hasReading.