HTML and CSS Reference

In-Depth Information

The first example calculates how far the user is from the birthplace of

Tim Berners-Lee. Although this example uses a single fixed point for

simplicity, the techniques involved will work just as well for more

advanced scenariosâ€”working out how far apart two users of your

website are, for example.

You may remember, from school, working out the distance between two

points on a plane using the Pythagorean theorem. Calculating the distance

between two latitude/longitude points isn't quite as straightforward

because these aren't points on a flat surface, but points on a sphere.

Rather than learn all that

math for yourself, you can use

an excellent set of JavaScript

utilities from Chris Veness,

available at
www.movabletype

library allows you to create

LatLon
objects that have several useful methods available. Starting with

a blank
HTML5
document, you can create the following page with five

simple steps.

1

Start with an empty
HTML5
page with a link to the LatLon.js

library. All the JavaScript code goes in the empty
init

function:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Geolocation 4</title>

<script src="LatLon.js"></script>

<script> function init() { } </script>

</head>

<body onload="init();">

</body>

</html>