html5, mobile: Sort POIs by distance

I am building a mobile web site for a physical product. The typical use-scenario is opening the web site by scanning a QR code on the product label.

I would like to have a page with a list of of vendors, ordered by distance from the phone's location. If the page can not get the phone's location, I would like to show the list sorted alphabetically.

What's the right wa开发者_C百科y to code this, in a way compatible with both iPhone and Android?

http://diveintohtml5.ep.io/geolocation.html explains usage of the HTML5 geolocation API.

You'll probably then want to make an AJAX call to some server which will retrieve a listing of vendors with their lat/long coordinates, name, etc. given the part you scanned.

If you got a geolocation result back, you can sort the list by distance using the standard sqrt(a*a+b*b) distance formula, assuming the distances aren't too far and you aren't too close to a pole, and depending on how accurate you need the distance calculation to be. If the distances are far, or you're at high or low latitudes, or the accuracy requirement is high, you'll need to do some more complicated math to operate on a spherical coordinate system.

The actual process of sorting the list will depend on what framework you're using (if any).