Video Transcript (Click to Expand)
Hi, this is Gary with MacMost Now. On today's episode a little something for web developers: how to get latitude and longitude on a web page, on an iPhone.
I'll post all this code with the video at the MacMost website, so check this URL.
The two functions here, the first is gpsError: this will just put up an alert with the error code and message that's passed in. The second one is showGPS, this is actually going to put the GPS information on the page. We're gonna set the inner text of that div tag to some text here which is latitude and then get position.coords.latitude and then longitude. Put that on two separate lines on the text, and that's the end of the script in the header.
The page itself is pretty simple: it's just going to have a link and on click it's going to call getGPS. And then here I've got that div tag ready to be filled in with the latitude and longitude information.
I should, of course point out that when a user clicks on that link and it tries to get their location, they're going to be prompted with a dialogue box asking if it's okay for that web page to know their current location, so there are really no privacy concerns here. Once you've said it's okay for that page to know, then it can go ahead and do other things with geolocation and it won't prompt them again so it doesn't get in the way too much.
So, when we bring up the page on the iPhone this is what we get, just this simple link here. When we click on that link we're quickly returned the information there, after that little dialogue box pops up asking us for permission.
You can take it a step further, of course and have a link that actually does something. For instance, here's a much longer piece of code that calls googlemaps.com and passes into it the latitude and longitude in addition to a text label. This here will put a little placeholder over the text showing your label, and the zoom here will zoom it all the way in. And you put that as the link, latitude and longitude, and now you have basically a link that will take you right to a Google Maps spot of that location. It'll actually do that on your iPhone in the Google Maps app, because the iPhone like that is smart enough to know that a link like that should just open up the Google Maps app, rather than opening up Google Maps in the web browser.