当前位置 : 主页 > 编程语言 > java >

通过百度地图API获取用户所在地理位置信息

来源:互联网 收集:自由互联 发布时间:2022-07-20
目录 ​​1、密匙申请​​ ​​2、源代码​​ ​​3、结果展示​​ 1、密匙申请 使用以下源码前,请先去百度地图开发平台申请密匙,前去申请:​​立即申请​​ 2、源代码 此次定


目录

​​1、密匙申请​​

​​2、源代码 ​​

​​3、结果展示​​


1、密匙申请

使用以下源码前,请先去百度地图开发平台申请密匙,前去申请:​​立即申请​​

通过百度地图API获取用户所在地理位置信息_百度地图

2、源代码 

此次定位代码是通过H5的方式实现的

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
#address {
text-align: center;
margin-top: 10%;
}

span {
color: red;
}
</style>
<!-- 百度地图 -->
<script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=XHKlS02dFCNn89Dqdv3HyNgFzP6DRrVU"></script>
<title>浏览器定位</title>
</head>

<body>
<div id="address">
<div>根据百度地图定位获取到地理位置信息</div>
<p>省份:<span id="province"></span></p>
<p> 城市:<span id="city"></span></p>
<p>详细地址:<span id="detail"></span></p>
</div>
</body>

</html>
<script type="text/javascript">
// 百度地图API功能
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function (r) {
if (this.getStatus() == BMAP_STATUS_SUCCESS) {
console.log(r.point.lng + "__" + r.point.lat);
getAddress(r.point.lng, r.point.lat);
}
else {
alert('failed' + this.getStatus());
}
}, { enableHighAccuracy: true })
//关于状态码
//BMAP_STATUS_SUCCESS 检索成功。对应数值“0”。
//BMAP_STATUS_CITY_LIST 城市列表。对应数值“1”。
//BMAP_STATUS_UNKNOWN_LOCATION 位置结果未知。对应数值“2”。
//BMAP_STATUS_UNKNOWN_ROUTE 导航结果未知。对应数值“3”。
//BMAP_STATUS_INVALID_KEY 非法密钥。对应数值“4”。
//BMAP_STATUS_INVALID_REQUEST 非法请求。对应数值“5”。
//BMAP_STATUS_PERMISSION_DENIED 没有权限。对应数值“6”。(自 1.1 新增)
//BMAP_STATUS_SERVICE_UNAVAILABLE 服务不可用。对应数值“7”。(自 1.1 新增)
//BMAP_STATUS_TIMEOUT 超时。对应数值“8”。(自 1.1 新增)
//通过经纬度获取地址信息
function getAddress(lng, lat) {
var myGeo = new BMap.Geocoder();
// 根据坐标得到地址描述
myGeo.getLocation(new BMap.Point(lng, lat), function (result) {
if (result) {
var province = result.addressComponents.province;
var city = result.addressComponents.city;
var detail = result.address;
console.log(province)
console.log(city)
document.getElementById("province").innerText = province;
document.getElementById("city").innerText = city;
document.getElementById("detail").innerText = detail;
}
});
}
</script>

3、结果展示

手机开启GPS导航位置更为精准一些

通过百度地图API获取用户所在地理位置信息_html_02

上一篇:asp.net GridView、DataGrid行单元格自动合并
下一篇:没有了
网友评论