watch-position.html

<html>
<head>
<title>geolocation.watchPosition demo</title>
</head>
<body>
<div id="output"></div>
<a href="geolocation.html">Click here for a better demo page.</a>
<script>
let output = document.getElementById('output');

function onSuccess(position) {
  console.log(position);
  output.innerHTML = `
<pre>
  latitude: ${position.coords.latitude}
  longitude: ${position.coords.longitude}
  altitude: ${position.coords.altitude}
  accuracy: ${position.coords.accuracy}
  altitudeAccuracy: ${position.coords.altitudeAccuracy}
  heading: ${position.coords.heading}
  speed: ${position.coords.speed}
  timestamp: ${position.timestamp}
</pre>
`;
}

function onError(error) {
output.innerHTML =
    `<span style="color: red">Error: </span>${error.message} (${error.code})`;
}

options = {
  enableHighAccuracy: true,
  timeout: 5000,
  maximumAge: 0
}

navigator.geolocation.watchPosition(onSuccess, onError, options);
</script>
</body>
</html>