正文
html5百度地图定位,html调用百度地图
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
如何使用HTML5地理位置定位功能
地理位置获取流程：
1、用户打开需要获取地理位置的web应用。
2、应用向浏览器请求地理位置，浏览器弹出询问窗口，询问用户是否共享地理位置。
3、假设用户允许，浏览器从设别查询相关信息。
4、浏览器将相关信息发送到一个信任的位置服务器，服务器返回具体的地理位置。
检测浏览器支持：
JavaScript Code复制内容到剪贴板
function loadDemo() {
if(navigator.geolocation) {
document.getElementById(“support”).innerHTML = “HTML5 Geolocation supported.”;
} else {
document.getElementById(“support”).innerHTML = “HTML5 Geolocation is not supported in
your browser.”;
}
}
位置请求方式：
单次请求
JavaScript Code复制内容到剪贴板
navigator.geolocation.getCurrentPosition(updateLocation, handleLocationError, options);
回调函数updateLocation接受一个对象参数，表示当前的地理位置，它有如下属性：
latitude——纬度
longitude——精度
accuracy——精确度，单位米
altitude——高度，单位米
altitudeAccuracy——高度的精确地，单位米
heading—运动的方向，相对于正北方向的角度
speed——运动的速度（假设你在地平线上运动），单位米/秒
回调函数handleLocationError接受错误对象，error.code是如下错误号。
UNKNOWN_ERROR (error code 0) —— 错误不在如下三种之内，你可以使用error.message获取错误详细信息。
PERMISSION_DENIED (error code 1)—— 用不选择不共享地理位置
POSITION_UNAVAILABLE (error code 2) ——无法获取当前位置
TIMEOUT (error code 3) ——在指定时间无法获取位置会触发此错误。
相关问答
Q1: 怎么HTML网页中获取百度地区显示用户当前地理位置，并且显示出位置坐标点。
在支持html5地理定位API的浏览器上，window.navigator对象新增了一个geolocation属性，以及相关的Geolocation API。都是用JS进行访问的。
下面是一个例子：
!doctype html
html lang="en"
head
meta charset="UTF-8"
title地理位置/title
/head
body
script
navigator.geolocation.getCurrentPosition(
function(position){
var cords = position.coords;
alert("当前经度："+cords.longtitude +", 纬度："+cords.latitude);
},
function(error){
var errorTypes={1:"位置服务被拒绝", 2:"获取不到位置信息", 3:"获取位置信息超时"};
alert( errorTypes[error.code] +":,不能确定当前地理位置");
}
);
/script
/body
/html
这只是一个例子，一般用经度和纬度调用地图如百度地图的API显示。
注意：在电脑本机上没法测试，一般把网页放到服务器上，用手机访问可以定位。
Q2: html5地理定位api怎么连接百度地图
可以实现的，HTML5可以使用手机的GPS信息，利用百度等地图的开放API就可以了。
HTML5中可以通过IP，WIFI信息，GPS，来实现地理定位，当然相关精度也是有所不同，所以如果要精确导航就得使用GPS信息。
下面是一段HTML5结合百度地图API来获取位置的代码：
div id="allmap"/div当前定位地址：a id="du-gps"/aspan/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
Q3: 百度地图怎样在手机上精确定位js html5
百度地图提供了专业的API，测试浏览器：ie11定位成功率100%，Safari定位成功率97%。其它浏览器暂时不行，HTML5获取不了地理位置信息。
Q4: 利用html5定位怎样不需要用户授权就能进行
单纯不授权不用第三方是绝对不可能的。第三方的话就用百度地图JavaScript API，这样就可以不用用户授权了。
百度地图简单的定位案例：
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(e){
//这个就是用户的经纬度
var long = e.point.lng;
var lat = e.point.lat;
});
Q5: html5的地理定位功能getCurrentPosition还能用吗？
能用，可以实现的，HTML5可以使用手机的GPS信息，利用百度等地图的开放API就可以了。
HTML5中可以通过IP，WIFI信息，GPS，来实现地理定位，当然相关精度也是有所不同，所以如果要精确导航就得使用GPS信息。
下面是一段HTML5结合百度地图API来获取位置的代码：
div id="allmap"/div当前定位地址：a id="du-gps"/aspan/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
