Whether you’re developing a web-based product, a mobile app, or a custom software program, there may come a time where you require the user’s location information, either in order to personalize the user experience or to fulfill a certain task. Having the capability to obtain the user’s current position is essential, and the best way to obtain this information is by using the Geolocation API.
The Geolocation API allows developers to query a user’s exact location by making use of the device’s positioning system, along with information from external sources such as Global Positioning System (GPS) satellites, mobile signal triangulation, and IP address censoring. The Geolocation API consists of the getCurrentPosition() method, which is the most commonly used method to determine user’s exact location from the web browser. With the getCurrentPosition() method, you can specify the accuracy of the user's location. It is also possible to use HTML5 Geolocation coordinates that provide an accurate indication of the user's geographic position.
In this article, you will learn how to use the Geolocation API to get the exact latitude and longitude coordinates, along with other useful information such as altitude, speed of movement, and heading. You will also learn how to adjust the accuracy of the location data to the client’s needs while making sure you don’t violate any privacy laws.
How to Obtain the Geo-Coordinates using the Geolocation API
To obtain the Geo-coordinates using the Geolocation API, you’ll need to make use of the getCurrentPosition() method, as shown in this example:
navigator.geolocation.getCurrentPosition(function(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
…
});
The getCurrentPosition() method is passed a callback function that receives the geographical position object created by the API. The position object will have properties such as coords.latitude and coords.longitude, which is used to determine the geographical coordinates. Afterward, you can use the returned coordinates for cashing, for targeting user-specific content, for creating location-based services and so on.
The getCurrentPosition() method supports two optional parameters, maximumAge which returns a cached position if it’s within the given age, and timeout which specifies that the request should be canceled if it takes more than a certain number of milliseconds. Here’s how the getCurrentPosition() method can be used with the two optional parameters:
navigator.geolocation.getCurrentPosition(function(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
…
}, 1000, 300);
In this example, the position will be fetched using a maximum age of 1000 milliseconds and a timeout of 300 milliseconds.
Other Useful Location Data
The position object returned by the getCurrentPosition() method is actually much richer than just basic longitude and latitude information. By including the optional enableHighAccuracy property in the getCurrentPosition() method, you can obtain other useful geographical data such as altitude, speed of movement and heading. Here’s an example of how to use the enableHighAccuracy property to gain access to more geographical data:
navigator.geolocation.getCurrentPosition(function(position)
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var altitude = position.coords.altitude;
var speed = position.coords.speed;
var heading = position.coords.heading;
…
}, true);
In this example, the enableHighAccurrency property is set to true, which will activate the API’s high accuracy mode. This will enable access to the altitude, speed, and heading properties in the position object. Once these properties are made available, you can use them to target user-specific content, create location-based services, and much more.
FAQ
What is the Geolocation API?
The Geolocation API allows developers to query a user’s exact location by making use of the device’s positioning system, along with information from external sources such as Global Positioning System (GPS) satellites, mobile signal triangulation, and IP address censoring.
How do I obtain the Geo-coordinates?
To obtain the Geo-coordinates, you’ll need to make use of the getCurrentPosition() method. It will return a position object that contains the necessary data regarding the user’s exact location.
What other information can I obtain from the Geolocation API?
By including the optional enableHighAccuracy property in the getCurrentPosition() method, you can obtain other useful geographical data such as altitude, speed of movement and heading.
How do I adjust the accuracy of the location data?
The getCurrentPosition() method supports two optional parameters, maximumAge which returns a cached position if it’s within the given age, and timeout which specifies that the request should be canceled if it takes more than a certain number of milliseconds.
Are there any privacy regulations I need to adhere to?
Yes, there may be privacy laws that you need to adhere to when obtaining location information from the user. To ensure you’re compliant, make sure to review the relevant regulations for your area before implementing a location-based service.