首页 > 技术文章 > 地理定位

zhenguoli 2017-09-13 16:37 原文

在HTML规范中,增加了获取用户地理信息的API,这样使得我们可以基于用户位置开发互联网应用,即基于位置服务 (Location Base Service)

 获取地理信息方式

1、IP地址

2、三维坐标

    GPS(Global Positioning System,全球定位系统)

  目前世界上在用或在建的第2代全球卫星导航系统(GNSS)有:1.美国 Global Positioning System (全球定位系统) 简称GPS;.2.苏联/俄罗斯 GLOBAL NAVIGATION SATELLITE SYSTEM (全球卫星导航系统)简称GLONASS(格洛纳斯);3.欧盟(欧洲是不准确的说法,包括中国在内的诸多国家也参与其中)Galileo satellite navigation system(伽利略卫星导航系统) 简称GALILEO(伽利略);4.中国 BeiDou(COMPASS) Navigation Satellite System(北斗卫星导航系统)简称 BDS ;5.日本 Quasi-Zenith Satellite System (准天顶卫星系统) 简称QZSS ;6.印度 India Regional Navigation Satellite System(印度区域卫星导航系统)简称IRNSS;以上6个系统中国都能使用。

    Wi-Fi

    手机信号

3、用户自定义数据

浏览器会自动以最优方式去获取用户地理信息。

 隐私

HTML5 Geolocation(地理位置定位) 规范提供了一套保护用户隐私的机制。必须先得到用户明确许可,才能获取用户的位置信息。

API详解

navigato.geolocation.getCurrentPosition(successCallback, errorCallback, options) 获取当前地理信息

navigator.geolocation.watchPosition(successCallback, errorCallback, options) 重复获取当前地理信息

1、当成功获取地理信息后,会调用succssCallback,并返回一个包含位置信息的对象position。Coords(坐标)

position.coords.latitude纬度

position.coords.longitude经度

2、当获取地理信息失败后,会调用errorCallback,并返回错误信息error

3、可选参数 options 对象可以调整位置信息数据收集方式

positionOptions 的数据格式为JSON,有三个可选的属性:

1enableHighAcuracy  布尔值: 表示是否启用高精确度模式,如果启用这种模式,浏览器在获取位置信息时可能需要耗费更多的时间。
2timeout  整数: 表示浏览需要在指定的时间内获取位置信息,否则触发errorCallback
3maximumAge  整数/常量: 表示浏览器重新获取位置信息的时间间隔。

代码示例

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script>
        /*navigator 导航*/
        //geolocation: 地理定位
//        window.navigator.geolocation
//        兼容处理
        if(navigator.geolocation){
//       如果支持,获取用户地理信息

//            successCallback 当获取用户位置成功的回调函数
//            errorCallback 当获取用户位置失败的回调函数

            navigator.geolocation.getCurrentPosition(successCallback,errorCallback);

        }else{
            console.log('sorry,你的浏览器不支持地理定位');
        }
        // 获取地理位置成功的回调函数
        function successCallback(position){
//            获取用户当前的经纬度
//            coords坐标
//            纬度latitude
            var wd=position.coords.latitude;
//            经度longitude
            var jd=position.coords.longitude;

            console.log("获取用户位置成功!");
            console.log(wd+'----------------'+jd);
//          40.05867366972477----------------116.33668634275229

//            谷歌地图:40.0601398850,116.3434224706
//            百度地图:40.0658210000,116.3500430000
//            腾讯高德:40.0601486487,116.3434373643
        }
        // 获取地理位置失败的回调函数
        function errorCallback(error){
            console.log(error);
            console.log('获取用户位置失败!')
        }
    </script>
</body>
</html>

 

推荐阅读