使⽤百度地图api获取地理位置JS使⽤百度地图api获取地理位置
⽂章⽬录
1.获取地图
参考⽂档:
1.1使⽤步骤:
1.2获取ak的步骤:
获取地址:
获取完成后:
1.3代码⽰例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使⽤百度地图api获取地理位置信息</title>
<style type="text/css">
html {
height: 100%
}
body {
height: 100%;
margin: 0px;
padding: 0px
}
#container {
height: 100%
}
</style>
// ak:为百度申请的ak
<script type="text/javascript" src="api.map.baidu/api?v=1.0&&type=webgl&ak=HpVGGX5OqiDCl32i8VucaD0UKC7rRuQ2"></script> </head>
<body>
百度api接口
<div id="container"></div>
<script type="text/javascript">
//  创建地图实例
var map = new BMapGL.Map("container");
//  设置中⼼点坐标
var point = new BMapGL.Point(116.404, 39.915);
//地图初始化,同时设置地图展⽰级别
</script>
</body>
</html>
2.获取定位信息
提供的定位服务
接⼝类名说明
浏览器定位Geolocation优先调⽤浏览器H5定位接⼝,如果失败会调⽤IP定位IP定位LocalCity根据⽤户IP 返回城市级别的定位结果
定位SDK辅助
定位Geolocation
当您的APP中有内置的Web页⾯,同时在Web页⾯需要提供您的当前位置信息时,可调⽤集成在App中的百度地图定位
SDK来获取更精准的位置信息
1.浏览器定位:
//  浏览器定位    allmap为div的di属性值
var map = new BMapGL.Map("allmap");
//  设置中⼼点坐标
var point = new BMapGL.Point(116.331398, 39.897445);  AndZoom(point, 12);
var geolocation = new BMapGL.Geolocation();
Status() == BMAP_STATUS_SUCCESS) {
var mk = new BMapGL.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
alert('您的位置:' + r.point.lng + ',' + r.point.lat);
} else {
alert('failed' + Status());
}
});
2.IP定位:
//  ip定位
var map = new BMapGL.Map("allmap");
var point = new BMapGL.Point(116.331398, 39.897445);  AndZoom(point, 12);
function myFun(result) {
var cityName = result.name;
map.setCenter(cityName);
alert("当前定位城市:" + cityName);
}
var myCity = new BMapGL.LocalCity();
<(myFun);