利用百度地图api可以做很多事情,个人感觉最核心也是最基础的就是定位功能了。这里分享一个制作的js可以实现登录网页后定位:
<script type="text/javascript"> var map; var gpspoint; var baidupoint; var gpsaddress; var baiduaddress; var x; var y; function getlocation() { //根据ip获取城市 var mycity = new bmap.localcity(); mycity.get(getcitybyip); //获取gps坐标 if (navigator.geolocation) { navigator.geolocation.getcurrentposition(showmap, handleerror, { enablehighaccuracy: true, maximumage: 1000 }); } else { alert("您的浏览器不支持使用html 5来获取地理位置服务"); } } function showmap(value) { var longitude = value.coords.longitude; var latitude = value.coords.latitude; map = new bmap.map("map"); x=latitude; y=longitude; //alert("坐标经度为:" + latitude + ", 纬度为:" + longitude ); gpspoint = new bmap.point(longitude, latitude); // 创建点坐标 //根据坐标逆解析地址 var geoc = new bmap.geocoder(); geoc.getlocation(gpspoint, getcitybycoordinate); bmap.convertor.translate(gpspoint, 0, translatecallback); map.enablescrollwheelzoom(true); } translatecallback = function (point) { baidupoint = point; map.centerandzoom(baidupoint, 18); var geoc = new bmap.geocoder(); geoc.getlocation(baidupoint, getcitybybaiducoordinate); } function getcitybycoordinate(rs) { gpsaddress = rs.addresscomponents; var address = "gps标注:" + gpsaddress.province + "," + gpsaddress.city + "," + gpsaddress.district + "," + gpsaddress.street + "," + gpsaddress.streetnumber; var marker = new bmap.marker(gpspoint); // 创建标注 map.addoverlay(marker); // 将标注添加到地图中 var labelgps = new bmap.label(address, { offset: new bmap.size(20, -10) }); marker.setlabel(labelgps); //添加gps标注 } function getcitybybaiducoordinate(rs) { baiduaddress = rs.addresscomponents; var address = "百度标注:" + baiduaddress.province + "," + baiduaddress.city + "," + baiduaddress.district + "," + baiduaddress.street + "," + baiduaddress.streetnumber; var marker = new bmap.marker(baidupoint); // 创建标注 map.addoverlay(marker); // 将标注添加到地图中 var labelbaidu = new bmap.label(address, { offset: new bmap.size(20, -10) }); marker.setlabel(labelbaidu); //添加百度标注 } //根据ip获取城市 function getcitybyip(rs) { var cityname = rs.name; alert("根据ip定位您所在的城市为:" + cityname); } function handleerror(value) { switch (value.code) { case 1: alert("位置服务被拒绝"); break; case 2: alert("暂时获取不到位置信息"); break; case 3: alert("获取信息超时"); break; case 4: alert("未知错误"); break; } } function init() { getlocation(); } window.onload = init; </script>
完成定位功能后可以添加相关代码编辑地图控件 覆盖物 信息窗口等等各种功能。
附上百度地图连接:
以上这篇利用百度地图api获取当前位置信息的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持移动技术网。
如对本文有疑问, 点击进行留言回复!!
JavaScript 好题汇总分享(持续更新,看到好题就写)
XMLHttpRequest 2级 &&进度事件&&JSONP
使用递归原生实现拷贝&&最简单的方法实现深拷贝
网友评论