javascript 移动端获取用户当前位置经纬度信息

一、HTML5 geolocation的属性
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(onSuccess , onError);
}else{
alert(“您的浏览器不支持使用HTML 5来获取地理位置服务”);
}
//定位数据获取成功响应
function onSuccess(position){
alert('纬度: ’ + position.coords.latitude + ‘\n’ +
'经度: ’ + position.coords.longitude + ‘\n’ +
'海拔: ’ + position.coords.altitude + ‘\n’ +
'水平精度: ’ + position.coords.accuracy + ‘\n’ +
'垂直精度: ’ + position.coords.altitudeAccura)
}
//定位数据获取失败响应
function onError(error) {
switch(error.code)
{
case error.PERMISSION_DENIED:
alert(“您拒绝对获取地理位置的请求”);
break;
case error.POSITION_UNAVAILABLE:
alert(“位置信息是不可用的”);
break;
case error.TIMEOUT:
alert(“请求您的地理位置超时”);
break;
case error.UNKNOWN_ERROR:
alert(“未知错误”);
break;
}
}
二、百度地图api定位
（1）HTML

因为是通过react，所以在html中需要定义一个全局的BMap对象

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=xxxxxxxxxx"></script>
<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
<script>
  window.BMap = BMap
</script>

（2）jsx

let BMap = window.BMap
let geolocation = new BMap.Geolocation()

geolocation.enableSDKLocation(); //允许SDK辅助
geolocation.getCurrentPosition(function (r) {
  if(this.getStatus() == 0){
    console.log(r)
  }
})

（3）成功后返回结果

三 、腾讯地图api定位
（1）HTML

（2）javascript

window.addEventListener(‘message’, function(event) {
// 接收位置信息
var loc = event.data;
console.log(‘location’, loc);
}, false) ;
setTimeout(function() {
if (!_this.loc) {
console.log(‘定位超时’)
}
}, 6000) // 6s为推荐值，业务调用方可根据自己的需求设置改时间，不建议太短
（3）成功后返回结果

百度地图api定位有偏差，腾讯地图定位相对比较准