Pick An API
Device Orientation reports tilt and heading as events. Geolocation reports a position with an accuracy radius. Each sits behind a permission gate.
Mobile Web Sensor APIs Explorer
Drive a simulated phone: move orientation angles to see DeviceOrientationEvent fields, and request a location to read its accuracy radius, permission flow, and watchPosition updates.
animation
simulation
sensors
mobile
geolocation
orientation
web-apis
permissions
A self-contained mobile web sensor lab bench. Set alpha, beta, and gamma to watch the DeviceOrientationEvent fields, the derived static-gravity vector, and a 3D phone; switch to Geolocation to request a fix, read its metres accuracy radius, walk the permission-prompt flow, and simulate watchPosition updates.
Do the phone lab without the phone.
Move the orientation angles and watch the exact fields a
deviceorientation event would deliver, plus the gravity vector the
same pose would put on the accelerometer. Then switch to Geolocation to request a
fix, read its metres accuracy radius, walk the permission prompt, and simulate
watchPosition updates. Every number here follows from a stated model,
not a real sensor.
Active APIDevice Orientation
PermissionPrompt not shown
Primary reading--
Evidence notePick a mode to begin
Grant Or Block
Requesting a sensor shows the browser's permission prompt. Choose Allow or Block and see how the reading, or the error, changes.
Read The Fields
Watch alpha, beta, gamma, latitude, longitude, and accuracy update live, next to the exact JavaScript handler that would produce them.
Judge The Evidence
A live value is not a result. Check whether the accuracy radius is smaller than your question and whether the pose matches your placement claim.
https://iotclass.org
Allow access to this sensor?
This page wants to use your device sensors while you use it.
Orientation Controls
Set the three Euler angles. Try a preset first, then fine-tune with the sliders.
Geolocation Controls
Choose a positioning source, request a fix, then decide if its accuracy is good enough for your task.
Device Orientation Event
A held-still device reports three angles. The gravity vector below is what a paired devicemotion event would show for the same pose.
Awaiting access
+y
+x
+z
still
N
Heading from alpha: 0° (N). Rotating the phone flat on a table changes only this heading, not the gravity reading.
deviceorientation fields
event.alpha heading0.0°event.beta front-back0.0°event.gamma left-right0.0°derived static gravity (m/s²)
accel.x0.00accel.y0.00accel.z9.81tilt from flat0.0°
Model: a still device at (β, γ) puts gravity at
gx = -cosβ·sinγ·g,
gy = sinβ·g,
gz = cosβ·cosγ·g with g = 9.81. Independent of
alpha. Illustrative; a real sensor adds noise and motion.
Handler you would writedeviceorientation
console > waiting for permission…
Geolocation Position
A fix is a point plus a radius. Compare the radius with the distance your task must resolve before you trust it.
No fix yet
position.coords
latitude--longitude--accuracy (m)--timestamp--good enough for the task?
accuracy ÷ task distance--
decision--
Accuracy ranges are illustrative, aligned with the chapter's roughly
4 m clear-sky outdoor and roughly 150 m indoor figures: GPS about 4-8 m, Wi-Fi about
30-70 m, cell fallback about 500-2000 m. They describe the model here, not a benchmark
of any real device.
Handler you would writegetCurrentPosition / watchPosition
console > no request sent yet.
Web Sensor API Quick Reference
deviceorientation
alpha: heading about z, 0..360°.beta: front-back tilt about x, -180..180°.gamma: left-right tilt about y, -90..90°.- Fires repeatedly; describes the device, not the person.
Geolocation
coords.latitude,coords.longitude.coords.accuracy: a radius in metres, at 95% confidence.timestamp: when the fix was produced.- Options:
enableHighAccuracy,timeout,maximumAge.
Permission & Secure Context
- Requires HTTPS and user consent.
- iOS motion/orientation need
requestPermission()from a gesture. - Consent can be revoked at any time.
- Handle denied, unavailable, and timeout as data.
Guided Practice
Exercise 1: Prove Placement
Set "Flat on table". Note that gravity sits almost entirely on accel.z and tilt from flat is near 0°. Now choose "Face down": which field flips sign, and why does that support a placement claim?
Exercise 2: Heading Is Not Tilt
Keep beta and gamma at 0 and sweep alpha across the full range. The compass turns, but the gravity vector does not move. Explain why heading cannot be recovered from gravity alone.
Exercise 3: Reject A Fix
Switch to Geolocation, choose Wi-Fi indoors, set the task distance to 10 m, and request a fix. Is the ratio above 1? Record the reject-or-defer decision rather than forcing the reading.
Exercise 4: Walk The Denial
Request access and press Block. The reading never arrives and an error state is recorded. Explain why a denied outcome with a timestamp is still valid lab evidence.
Technical Notes And Sources
What Is Standard-Based
The field names, ranges, axis meanings, and the accuracy-as-metres-radius definition follow the W3C DeviceOrientation Event and Geolocation specifications. The permission-first flow mirrors real browser behaviour.
What Is A Teaching Model
The gravity vector uses gx=-cosβ·sinγ·g, gy=sinβ·g, gz=cosβ·cosγ·g, verified against a full Z-X'-Y'' rotation matrix. Accuracy ranges and coordinates are illustrative, not measured.
What To Remember
A displayed value is not a result. Read the axis convention, the placement, the accuracy radius, the timestamp, and the permission outcome before you accept any mobile web reading.