Was ist ein Gyroskop?

Ein Gyroskop ist ein winziger Sensor in deinem Telefon, Tablet oder Laptop, der Rotationen um drei Achsen misst. In Kombination mit dem Beschleunigungsmesser und dem Magnetometer teilt es dem Gerät mit, in welche Richtung es geneigt ist, wie schnell es sich dreht und in welche Richtung es zeigt. Diese Daten ermöglichen die automatische Bildschirmdrehung, erweiterte Realität, Rennspiele, Panoramafotografie, Schrittezählung und Bildstabilisierung.

Moderne Geräte stellen diese Informationen Webbrowsern über die DeviceOrientationEvent API zur Verfügung. Der Browser meldet drei Winkel — Alpha, Beta und Gamma — die zusammen die Ausrichtung des Geräts im 3D-Raum relativ zur Erde beschreiben.

Alpha, Beta und Gamma verstehen

Die drei Ausrichtungswinkel beschreiben jeweils die Rotation um eine andere Achse:

  • Alpha (0–360°) — Rotation um die Z-Achse (vertikal). Stell dir vor, du drehst das Gerät flach auf einem Tisch; Alpha ist die kompassähnliche Ausrichtung.
  • Beta (-180–180°) — Rotation um die X-Achse (von links nach rechts). Dies ist die Neigung von vorne nach hinten, wie wenn du das Gerät zu dir hin oder weg von dir neigst.
  • Gamma (-90–90°) — Rotation um die Y-Achse (von oben nach unten). Dies ist die Neigung von links nach rechts, wie wenn du das Gerät zur Seite neigst.

Werkzeugbeschreibung

Dieses Werkzeug liest Live-Ausrichtungsdaten vom Gyroskop deines Geräts und rendert sie als 3D-Modell, das deine Bewegung in Echtzeit widerspiegelt. Es zeigt auch die rohen Alpha-, Beta- und Gamma-Werte in Grad an, damit du überprüfen kannst, ob der Sensor korrekt funktioniert und genaue Messwerte liefert.

Beispiele

Geräteposition Alpha Beta Gamma
Flach liegend, Bildschirm oben, Oben zeigt N
Aufrecht im Hochformat gehalten 90°
Rechte Kante nach unten geneigt (Querformat) 90°
180° gedreht flach, Bildschirm immer noch oben 180°

Funktionen

  • Live-3D-Modell, das sich synchron mit deinem Gerät dreht
  • Echtzeit-Alpha-, Beta- und Gamma-Messwerte in Grad
  • Erkennt, ob der Browser die Orientierungs-API unterstützt
  • Verarbeitet iOS-Berechtigungsaufforderungen für Bewegungszugriff
  • Zeigt an, ob die Ausrichtungsdaten absolut (bezogen auf die Erde) oder relativ sind

Anwendungsfälle

  • Diagnose eines fehlerhaften Sensors — Überprüfe, ob das Gyroskop deines Telefons korrekt funktioniert, bevor du es zur Reparatur sendest oder zurückgibst.
  • Test von Web-Apps, die Bewegung verwenden — Entwickler, die AR-Erfahrungen, bewegungsgesteuerte Spiele oder VR-Vorschauen erstellen, können Sensoreingaben direkt im Browser validieren.
  • Kalibrierungsprüfung — Bestätige, dass die Ausrichtungswerte auf Null zurückkehren, wenn das Gerät flach liegt, um Drift oder Fehlkalibrierung zu erkennen.

Wie es funktioniert

Das Werkzeug abonniert das deviceorientation Ereignis des Browsers, das jedes Mal ausgelöst wird, wenn sich die Ausrichtung deines Geräts ändert. Jedes Ereignis liefert die aktuellen Alpha-, Beta- und Gamma-Werte. Das 3D-Modell verwendet Three.js, um diese Winkel in eine Quaternion-Rotation umzuwandeln, die mit sanfter Interpolation bei jedem Animationsframe angewendet wird, um Zittern zu vermeiden.

Einschränkungen

  • Erfordert ein Gerät mit eingebautem Gyroskop (die meisten Desktops und viele Laptops haben keines)
  • iOS Safari erfordert explizite Berechtigung über eine Benutzergeste, bevor Sensordaten freigegeben werden
  • Erfordert einen sicheren Kontext (HTTPS) auf den meisten modernen Browsern
  • Einige Browser melden die Ausrichtung nur, wenn die Seite im Vordergrund ist

Tipps

  • Wenn die Messwerte bei Null bleiben, hat dein Gerät wahrscheinlich kein Gyroskop oder der Browser blockiert den Zugriff
  • Auf iOS tippe auf die Schaltfläche „Bewegung aktivieren", nachdem die Seite geladen wurde — die Berechtigung kann nicht automatisch erteilt werden
  • Lege das Gerät auf einer stabilen Oberfläche flach hin, um die Basiswerte zu bestätigen, bevor du Neigungen testest