摘要：
V=2.0&ak=yourkey“˃在页面中定义一个ID为allmap的DIV标记：避免以下情况：1UncaughtTypeError:Cannotreadproperty'gc'undefined通过SDK辅助定位获取坐标，然后获取当前用户的详细地址varmap=newBMap.Map；//创建Map实例。请注意，页面上必须有一个id为allmp的divvarpoint=newBMap。//创建一个坐标Map.centerAndZoom；//初始化地图，设置中心点坐标和地图级别vargeolocation=newBMapp.Geolocation（）；vargc=newBMap.Geocode（）；//创建地理编码器。//启用SDK辅助定位Geolocation.enableSDK Location（） ; 地理位置。获取当前位置；通过浏览器定位获取当前经度和纬度：varmap=newBMap。地图varpoint=新BMap。指向地图中心和缩放；vargeolocation=新BMap。地理位置（）；地理位置。获取当前位置；IP位置以获取当前城市varmap=newBMap。地图varpoint=新BMap。指向地图中心和缩放；函数myFun｛varcityName=result.name；map.setCenter；alert；｝varmyCity=新BMap。LocalCity（）；我的城市。获取；通过详细的地理位置交换当前用户的经度和纬度坐标http://api.map.baidu.com/geocoder/v2/?
本文并非原创，原创地址为：https://www.cnblogs.com/Can-daydayup/p/10941470.html
前言：
前段时间刚好使用了百度地图的js api定位获取用户当前经纬度并获取当前详细位置和通过当前用户详细地理位置换取用户当前经纬度坐标的功能，为了方便下次找起来方便一些自己在这里记录一下，希望也能够帮助到有需要的童鞋们！
解决方案：
引入JavaScript API v2.0 SDK
1 | <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> |
在页面中定义一个以ID为allmap的DIV标签：
<div id="allmap"></div>
避免页面中出现：
1 | Uncaught TypeError: Cannot read property 'gc' of undefined |
通过SDK 辅助定位获取坐标，然后在获取当前用户详细地址
<script type="text/javascript">
var map = new BMap.Map("allmap");//创建Map实例，注意页面中一定要有个id为allmp的div
var point = new BMap.Point(116.331398,39.897445);//创建定坐标
map.centerAndZoom(point,12);//// 初始化地图,设置中心点坐标和地图级别
var geolocation = new BMap.Geolocation();
var gc = new BMap.Geocoder();//创建地理编码器
// 开启SDK辅助定位
geolocation.enableSDKLocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus() == BMAP_STATUS_SUCCESS){
var mk = new BMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
alert('您的位置：' + r.point.lng + ',' + r.point.lat);
var pt = r.point;
map.panTo(pt);//移动地图中心点
//alert(r.point.lng);//X轴
//alert(r.point.lat);//Y轴
gc.getLocation(pt, function(rs){
var addComp = rs.addressComponents;
//alert(addComp.city);
alert(addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber);
});
}
else {
alert('failed'+this.getStatus());
}
});
</script>通过浏览器定位获取当前经纬度：
<script type="text/javascript">
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus() == BMAP_STATUS_SUCCESS){
var mk = new BMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
alert('您的位置：'+r.point.lng+','+r.point.lat);
}
else {
alert('failed'+this.getStatus());
}
});
</script>ip定位获取当前所在城市
<script type="text/javasript">
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);
function myFun(result){
var cityName = result.name;
map.setCenter(cityName);
alert("当前定位城市:"+cityName);
}
var myCity = new BMap.LocalCity();
myCity.get(myFun);
</script>通过详细地理位置换取当前用户经纬度坐标
http://api.map.baidu.com/geocoder/v2/?address=长沙市&output=json&ak=您的密钥
我使用的是ajax请求数据，注意假如dataType为json时会出现跨域问题，最终我使用的是jsonp请求就解决了：
json和jsonp之间的区别：https://www.cnblogs.com/strugglion/p/5929821.html
$.ajax({
url:"http://api.map.baidu.com/geocoder/v2/?address="+city+"&output=json&ak=您的密钥",
dataType:'jsonp',
processData: false,
type:'get',
success:function(data){
console.log(data);
if (data.status==0) {
console.log("纬度:"+data.result.location.lat+"经度:"+data.result.location.lng);
}
},
error:function(XMLHttpRequest, textStatus, errorThrown) {
console.log(XMLHttpRequest.status);
console.log(XMLHttpRequest.readyState);
console.log(textStatus);
}});返回json格式的响应数据：
1 | {"status":0,"result":{"location":{"lng":112.94547319535288,"lat":28.23488939994364},"precise":0,"confidence":12,"comprehension":100,"level":"城市"}} |