keyboard_backspace wifi_off

Speed meter

Measure your speed using the Geolocation API and DeviceMotion event.

Demo

Click the "Start meter" button to begin measuring your speed and start walking or driving. The speedometer will display your current speed in km/h.

0 km/h

Code

coords.speed is in metres per second. DeviceMotion helps suppress small speed readings when the device is still. This simplified example shows the display conversion and rounding.

let quietSince = null; let still = false; window.addEventListener('devicemotion', ({acceleration}) => { if(!acceleration || ![acceleration.x, acceleration.y, acceleration.z].every(Number.isFinite)) { return; } quietSince = Math.hypot(acceleration.x, acceleration.y, acceleration.z) < 0.25 ? quietSince ?? performance.now() : null; still = quietSince !== null && performance.now() - quietSince > 2000; }); navigator.geolocation.watchPosition(({coords}) => { const speed = Number.isFinite(coords.speed) && coords.speed >= 0 ? coords.speed : 0; const speedKmh = (still && speed < 0.6 ? 0 : speed) * 3.6; console.log(Math.floor(speedKmh) + (speedKmh % 1 > 0.5 ? 1 : 0)); }, {enableHighAccuracy: true});

Documentation

Geolocation API on MDN

DeviceMotionEvent on MDN

Browser support

Geolocation API on caniuse.com

DeviceMotion on caniuse.com

What PWA Can Do Today A showcase of what is possible with Progressive Web Apps today

You are offline, external links cannot be opened.