HTML5 Geolocation Using Google Map
HTML5 Geolocation Using Google Map
HTML5 Geolocation using google map
In this script we will first identify a user’s geographical position using longitude and latitude from the browser using HTML5 Geolocation API. This is only available in HTML5 navigator.geolocation enabled web browsers. In this script the browser will first confirm with user to approve whether it can share the position with a website or not. Only when a user approves this request our script will work as expected. In HTML5 Geolocation function showPosition() contains those values (Longitude & Latitude). We then pass these values to function mymap() of google maps. From there I am using Geo code reverse functionality of Google Maps to identify the city name from longitude and latitude values. Please note that I am using zoom value of 11 here for the maps. You are free to use any value of your choice.
Refer Google Map Documentation For More Code / Details
This is how different browsers prompt users about sharing their geolocation.
Go to the next page to see this code in action 🙂
HTML5 Geolocation Using Google Map,