O'Reilly logo

HTML5 Foundations by Matthew West

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

chapter thirteen

Using Geolocation

For many years now, devices such as mobile phones have had built-in GPS locators that allow native applications to get the geographic location of the device at any given time. This functionality can now be accessed by your web applications too, using the new GeoLocation API. Although this API is not strictly part of HTML5, it is fun to play around with and so I have included it in this book.

In this chapter, you learn how to use the GeoLocation API to request a user’s location. You will be modifying the Locations page so that it highlights the restaurant location that is closest to the user. To do this, you will be using the GeoLocation API and a small JavaScript library that I have provided. Figure 13-1 shows how your Locations page will look by the time you complete this chapter.

9781118432693-fg1301.tif

Map data 2012 © Google

Figure 13-1 Using the GeoLocation API to highlight the nearest restaurant on the Locations page.

Getting the User’s Location

html5_badge.psd  The GeoLocation API is remarkably simple to use. Browsers that support geolocation expose a geolocation interface that has a number of methods (kind of like how you call ­getElementById() on the document object).

The main method that you will be using in this chapter is getCurrentPosition(). This will return a GeoPosition ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required