当前位置: 移动技术网 > IT编程>开发语言>JavaScript > 利用百度地图API获取当前位置信息的实例

利用百度地图API获取当前位置信息的实例

2017年12月12日  | 移动技术网IT编程  | 我要评论

利用百度地图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获取当前位置信息的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持移动技术网。

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网