HTML5地理定位

HTML5地理定位

1、geolocation API（地理定位）

允许我们喜欢的网站分享我们的位置信息。

在开发中使用JS可以获取我们当前位置的坐标（经纬度）。

geolocation是基于navigator的一个新属性。我们创建一个地理定位的方式：

var getlocation = navigator. geolocation

getCurrentPosition()是基于地理定位的一个方法，它可以让我们获取到我们当前位置的坐标。

例如：

window.onload = getLocation;
function getLocation(){
    var locationEle = document.getElementById("p1");
    //判断是否支持地理定位
    if(navigator.geolocation){
        navigator.geolocation.getCurrentPosition(function(position){
            var log = position.coords.longitude;//获取经度
            var lat = position.coords.latitude;//获取纬度
            locationEle.innerHTML = "经度为："+log +";纬度为："+lat;
        });
    }else{
        location.innerHTML = "该浏览器不支持地理定位";
    }
}

注意：（1）取变量名的时候注意必要时用关键字。比如：location

（2）当没有设置点击事件的时候，要页面加载就要调用函数。

2、出现的问题

获取到的坐标与实际位置有偏差。原因就是：系统使用的是火星坐标。

那么什么是火星坐标呢？

火星坐标：是一种国家保密插件，也叫做加密插件或者加偏或者SM模组，其实就是对真实坐标系统进行人为的加偏处理，按照特殊的算法，将真实的坐标加密成虚假的坐标，而这个加偏并不是线性的加偏，所以各地的偏移情况都会有所不同。而加密后的坐标也常被人称为火星坐标系统。（来源于百度）

怎样解决获取的火星坐标呢？

通过正规的地图公司（例如高的地图、百度地图），我们可以申请使用key值，通过这些网站的秘钥进行解析，从而可以获得真正的坐标值（无偏移的）。

在这里需要注意的是：高德地图提供的key值获取到的实际坐标，用百度地图反查会有偏移，反过来也是一样的。所以就告诉我们，以后我们使用哪个地图公司的key值，就使用哪个地图公司的地图。