这次给大家带来用Geolocation获取地理位置信息，用Geolocation获取地理位置信息的注意事项有哪些，下面就是实战案例，一起来看一下。
Html5中提供了地理位置信息的API，通过浏览器来获取用户当前位置。基于此特性可以开发基于位置的服务应用。在获取地理位置信息前，首先浏览器都会向用户询问是否愿意共享其位置信息，待用户同意后才能使用。
Html5获取地理位置信息是通过Geolocation API提供，使用其getCurrent注意事项方法，此方法中有三个参数，分别是成功获取到地理位置信息时所执行的注意事项，失败时所执行的回调函数和可选属性配置项。
如下Demo演示了通过Geolocation获取地理位置信息，并在百度地图上显示当前位置（通过调用百度地图API）。实验结果发现位置被定位到了大学城内环东四路入口处，与本人所在位置（华工学生宿舍）偏差还是有点大的，达到200-300米左右。
代码如下所示（其中convertor.js为百度地图提供的坐标转化文件）：
H5地理位置Demo if (window.navigator.geolocation) { var options = { enableHighAccuracy: true, }; window.navigator.geolocation.getCurrentPosition(handleSuccess, handleError, options); } else { alert("浏览器不支持html5来获取地理位置信息"); } function handleSuccess(position){ // 获取到当前位置经纬度 本例中是chrome浏览器取到的是google地图中的经纬度 var lng = position.coords.longitude; var lat = position.coords.latitude; // 调用百度地图api显示 var map = new BMap.Map("map"); var ggPoint = new BMap.Point(lng, lat); // 将google地图中的经纬度转化为百度地图的经纬度 BMap.Convertor.translate(ggPoint, 2, function(point){ var marker = new BMap.Marker(point); map.addOverlay(marker); map.centerAndZoom(point, 15); }); } function handleError(error){ }
登录后复制
convertor.js文件：
(function() { // 闭包 function load_script(xyUrl, callback) { var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = xyUrl; // 借鉴了jQuery的script跨域方法 script.onload = script.onreadystatechange = function() { if ((!this.readyState || this.readyState === "loaded" || this.readyState === "complete")) { callback && callback(); // Handle memory leak in IE script.onload = script.onreadystatechange = null; if (head && script.parentNode) { head.removeChild(script); } } }; // Use insertBefore instead of appendChild to circumvent an IE6 bug. head.insertBefore(script, head.firstChild); } function translate(point, type, callback) { var callbackName = 'cbk_' + Math.round(Math.random() * 10000); // 随机函数名 var xyUrl = "http://api.map.baidu.com/ag/coord/convert?from=" + type + "&to=4&x=" + point.lng + "&y=" + point.lat + "&callback=BMap.Convertor." + callbackName; // 动态创建script标签 load_script(xyUrl); BMap.Convertor[callbackName] = function(xyResult) { delete BMap.Convertor[callbackName]; // 调用完需要删除改函数 var point = new BMap.Point(xyResult.x, xyResult.y); callback && callback(point); } } window.BMap = window.BMap || {}; BMap.Convertor = {}; BMap.Convertor.translate = translate;})();
登录后复制
相信看了本文案例你已经掌握了方法，更多精彩请关注【创想鸟】其它相关文章！
推荐阅读：
注意事项
注意事项
以上就是用Geolocation获取地理位置信息的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/3124924.html
