html5地理定位api怎么连接百度地图

可以实现的，HTML5可以使用手机的GPS信息，利用百度等地图的开放API就可以了。

HTML5中可以通过IP，WIFI信息，GPS，来实现地理定位，当然相关精度也是有所不同，所以如果要精确导航就得使用GPS信息。

下面是一段HTML5结合百度地图API来获取位置的代码：

<div id="allmap"></div>当前定位地址：<a id="du-gps"></a><span></span></div>

<script>

var map = new BMap.Map("allmap")

var geolocation = new BMap.Geolocation()

geolocation.getCurrentPosition(function(r){

if(this.getStatus() == BMAP_STATUS_SUCCESS){

map.panTo(r.point)

//alert('您的位置：'+r.point.lng+','+r.point.lat)

var pt = r.point

var geoc = new BMap.Geocoder()

geoc.getLocation(pt, function(rs){

var addComp = rs.addressComponents

//alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber)

$("#du-gps").text(addComp.district+addComp.street+addComp.streetNumber)

})

}

else {

alert('failed'+this.getStatus())

}

},{enableHighAccuracy: true})

</script>

使用HTML5的NotificationAPI的方法：1、申请权限出于安全考虑，要发送桌面消息，需要先申请用户授权。Notification对象提供了一个静态的方法——requestPermission()，它接收一个回调函数作为参数，并把返回值传递给回调函数作为参数：Noti

最近项目需要，稍微研究一下html5获取当前地理位置的问题。

获取当前位置的经纬度很简单，一句代码就搞定

[javascript] view plain copy

navigator.geolocation.getCurrentPosition(function (position) {

longitude = position.coords.longitude

latitude = position.coords.latitude

})

然后查阅百度地图API，很easy，也是几句代码就搞定的事

[javascript] view plain copy

var map = new BMap.Map("allmap")<pre name="code" class="javascript">        var point = new BMap.Point(longitude,latitude)<pre name="code" class="javascript">        var geoc = new BMap.Geocoder()

[javascript] view plain copy

geoc.getLocation(point, function(rs){

var addComp = rs.addressComponents

alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber)

})

好的，本以为到此结束，结果实际测试发现有点问题，显示的位置与我的真正位置偏差大约两三公里左右。

一开始以为是html5获取经纬度的偏差问题，然而并不是

然后开始查资料，求助强大的度娘，然后无意中发现了一个叫做 坐标转换 的东西，一搜索才知道，原来百度地图对坐标进行了深度封装，必须通过他提供的接口进行坐标转换才行

（当然了，还是因为我以前没接触过百度地图，所以不知道这点知识，常用百度地图api的应该对这个很熟悉的吧）

好了，废话不多说，上最终代码吧

[javascript] view plain copy

var map = new BMap.Map("allmap")

var longitude, latitude

navigator.geolocation.getCurrentPosition(function (position) {

longitude = position.coords.longitude

latitude = position.coords.latitude

})

setTimeout(function () {

var gpsPoint = new BMap.Point(longitude, latitude)

BMap.Convertor.translate(gpsPoint, 0, function (point) {

var geoc = new BMap.Geocoder()

geoc.getLocation(point, function (rs) {

var addComp = rs.addressComponents

alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber)

})

})

}, 3000)

这段代码依赖两个包

[html] view plain copy

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=秘钥"></script>

<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>

---