使用navigator.geolocation来获取用户的地理位置信息

使用navigator.geolocation来获取用户的地理位置信息
 W3C 中新添加了一个名为 Geolocation的 API 规范，Geoloaction API的做用就是经过浏览器获取用户的地理位置。咱们可使用navigator.geolocation来简单的获取用户的地理位置信息。本文中将简单介绍下W3C的Geolocation。
Geolocation在javascript的navigator 对象中，咱们能够经过 navigator.geolocation 来使用它。不支持 geolocation 的浏览器并不包含这一对象，那么能够经过下面的代码来作能力检测，对不一样的浏览器作不一样的处理。
if (navigator.geolocation) {
        alert( ' 浏览器支持 geolocation ' );
}else{
        alert( ' 浏览器不支持 geolocation ' );
}
在访问 geolocation 对象时，即调用 geolocation 下面的方法时，浏览器会弹出提示，询问用户是否许可网站提供的位置服务，只有在获得用户许可事后，服务才会继续，不然将被中止，在稍后你将会了解到，咱们可以捕获到用户拒绝服务的动做。下面这张图分别是 Chrome , Firefox 和 Opera 在初次访问 geolocation 时，给用户的提示：

初次使用geolocation时的警告框
经常使用的navigator.geolocation对象有如下三种方法：
1获取当前地理位置：navigator.geolocation.getCurrentPosition(success_callback_function, error_callback_function, position_options)
2持续获取地理位置：navigator.geolocation.watchPosition(success_callback_function, error_callback_function, position_options)
3清除持续获取地理位置事件：navigator.geolocation.clearWatch(watch_position_id)
其中success_callback_function为成功以后处理的函数，error_callback_function为失败以后返回的处理函数，参数position_options是配置项，由JSON格式传入：
4enableHighAccuracy：true/false，它将告诉浏览器是否启用高精度设备，所谓的高精度设备包含但不局限于前面所提到的 GPS 和 WIFI，值为 true 的时候，浏览器会尝试启用这些设备，默认指为 true，在这种状况下，浏览器会尽量地进行更为精确的查询，简单地说，若是用户有可用的 GPS 设备，会返回 GPS 设备的查询结果，IP 是最后的选择，对于移动设备来讲，网络接入点(基站)或许成为另外一个选择，对此我尚未彻底了解，但根据测试，即时没有任何额外功能的手机，也可以获得更为精确的查询结果。
5maximumAge：单位毫秒，告诉设备缓存时间，主要用于设备的省电或者节省带宽方面。
6timeout：单位毫秒，超时事件，获取位置信息时超出设定的这个时长，将会触发错误，捕获错误的函数将被调用，而且错误码指向TIMEOUT。
例以下面的代码：
var geo=navigator.geolocation.getCurrentPosition(geo_success, geo_error, {enableHighAccuracy:true, 
    maximumAge:30000, 
    timeout:27000});


获取当前地理位置方法：navigator.geolocation.getCurrentPosition
当得到用户的许可事后，便一切就绪。咱们将经过 geolocation 下的 getCurrentPosition 方法来获取用户当前的地理位置信息。
一、正确返回地理位置信息的处理函数
例如咱们的成功处理函数这样写：
function getPositionSuccess( position ){
        var lat = position.coords.latitude;
        var lng = position.coords.longitude;
        document.write( "您所在的位置： 经度" + lat + "，纬度" + lng );
}
处理函数中的position 对象包含了用户的地理位置信息，该对象下面的 coords 子对象包含了用户所在的纬度和经度信息，经过 position.coords.latitude 能够访问纬度，而 position.coords.longitude 中存放了经度的信息，用户的位置信息越精确，这两个数字后面的小数点越长。事实上，在 Firefox 中，position 对象下还附带有另外一个 address 对象，这个对象包含这个经纬度下的国家名，城市名甚至街道名，例以下面的代码：
function getPositionSuccess( position ){
        var lat = position.coords.latitude;
        var lng = position.coords.longitude;
        alert( "您所在的位置： 经度" + lat + "，纬度" + lng );
        if(typeof position.address !== "undefined"){
                var country = position.address.country;
                var province = position.address.region;
                var city = position.address.city;
                alert(' 您位于 ' + country + province + '省' + city +'市');
        }
}
coords其余返回信息：
7coords.accuracy：返回经纬度的精度（米）
8coords.speed :速度
9coords.altitude ：当前的高度，海拔（米）
10coords.altitudeAccuracy：高度的精度（米）
11coords.heading：朝向
二、返回错误时的处理函数
上面都是成功获取到用户位置信息的处理，可是出现问题的状况在所不免，当获取用户的位置信息出错时，传递到 getCurrentPosition 的第二个函数类型参数被调用，一个包含具体出错信息的对象会被传递进去，错误将被捕获。
function getPositionError(error){
    switch(error.code){
        case error.TIMEOUT :
            alert( " 链接超时，请重试 " );
            break;
        case error.PERMISSION_DENIED :
            alert( " 您拒绝了使用位置共享服务，查询已取消 " );
            break;
        case error.POSITION_UNAVAILABLE : 
            alert( " 亲爱的火星网友，很是抱歉，咱们暂时没法为您所在的星球提供位置服务 " );
            break;
    }
}
error 对象下面，存放了3个常量：
12TIMEOUT:表示获取信息超时。
13PERMISSION_DENIED：表示用户选择了拒绝了位置服务。
14POSITION_UNAVAILABLE：表示位置不可知。
说明：而每一次出错时 error.code 将指向3个常量之中的一个。
移动设备持续获取地理位置方法：navigator.geolocation.watchPosition
对于使用移动设备的用户来讲，位置并非固定的，W3C 固然也考虑到了这一点，watchPosition 是一个专门用来处理这一状况的方法，watchPosition 被调用后，浏览器会跟踪设备的位置，每一次位置的变化，watchPosition 中的代码都将会被执行。对于致力于移动设备 web 开发的同窗来讲，这个方法是及其重要的，它也许将会改变 web 移动客户端的格局。
使用navigator.geolocation.clearWatch既能够清除navigator.geolocation.watchPosition的监控事件。
Geolocation实例演示
查看Geolocation实例演示
写在最后
定位通常采用的wifi会比较准确，采用IP的时候通常会定位到所在的城市中心，更多关于地图定位的文章：
15php获取来访者IP信息
16php、js两种不一样方式根据关键词返回经纬度接口【基于Google map API】
17根据IP返回地理位置地址以及地理经纬度的方法
18基于Google地图的根据IP返回地理位置的接口