You are previewing HTML5 Foundations.

HTML5 Foundations

Cover of HTML5 Foundations by Matthew West Published by John Wiley & Sons

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.


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 ...

The best content for your career. Discover unlimited learning on demand for around $1/day.