HTML5 provides geo-location information in the API, through the browser to get the user's current location. Based on this feature, location-based service applications can be developed. Before obtaining geolocation information, the browser will first ask the user if they would like to share their location information before they can use it until the user consents.
HTML5 Obtaining geolocation information is provided through the Geolocation API, using its GetCurrentPosition method, which has three parameters, namely the callback function that was executed when the location information was successfully obtained, the callback function that was executed when the failure occurred, and an optional property configuration item.
The following demo shows the location information via geolocation and shows the current location on the Baidu map (by calling the Baidu Map API). The experimental results found that the location was located in the University city inner ring East Four road entrance, and my location (Chinese students dormitory) deviation is still a bit large, reaching about 200-300 meters.
The code is shown below (where convertor.js is the coordinate conversion file provided by Baidu map):
1 <! DOCTYPE html> 2 Convertor.js file:
1 (function () {//Closure 2 function Load_script (Xyurl, callback) {3 var head = document.getElementsByTagName (' H EAD ') [0]; 4 var script = document.createelement (' script '); 5 Script.type = ' Text/javascript '; 6 script.src = Xyurl; 7//Draw on jquery's script cross-domain method 8 script.onload = Script.onreadystatechange = function () {9 if ((!t His.readystate | | This.readystate = = = "Loaded" | | This.readystate = = = "complete") {callback && callback ();//Handle memory Le AK in IE12 script.onload = Script.onreadystatechange = null;13 if (head && script). ParentNode) {head.removechild (script), 15}16}17};18/ /use InsertBefore instead of appendchild to circumvent an IE6 bug.19 head.insertbefore (script, head.firstchild); 2 0}21 function Translate (point, type, callback) {$ var CallbaCkname = ' Cbk_ ' + math.round (math.random () * 10000); Random function name @ var xyurl = "http://api.map.baidu.com/ag/coord/convert?from=" + Type24 + "&to=4& ; x= "+ point.lng +" &y= "+ Point.lat25 +" &callback=bmap.convertor. "+ callbackname;26// Dynamically create a Script tag load_script (xyurl), bmap.convertor[callbackname] = function (Xyresult) {. del Ete Bmap.convertor[callbackname]; You need to delete the modified function at the end of the call. var point = new Bmap.point (xyresult.x, XYRESULT.Y); callback && callback (point),}33}34 window. BMap = window. BMap | | {};36 Bmap.convertor = {};37 BMap.Convertor.translate = translate;38}) ();
HTML5 geolocation Get geo-location information (GO)