PhoneGap Geolocation 获取地理位置 api

一、 PhoneGap Geolocation 对象介绍

　　1、使应用程序可以访问地理位置信息。geolocation 对象提供了对设备 GPS 传感器的访问。Geolocation 提供设备的位置信息，例如经度和纬度。

　　2、位置信息的常见来源包括全球定位系统（GPS），以及通过诸如 IP 地址、RFID、WiFi 和蓝牙的 MAC 地址、和 GSM/CDMA 手机 ID 的网络信号所做的推断。

　　3、不能保证该 API 返回的是设备的真实位置信息。这个 API 是基于 W3C Geo location API Specification 实现的。

　　4、有些设备已经提供了对该规范的实现，对于这些设备采用内置实现而非使用 PhoneGap 的实现。

　　5、对于没有地理位置支持的设备，PhoneGap 提供了统一的支持。

　　6、方法

　　　　geolocation.getCurrentPosition

　　　　geolocation.watchPosition

　　　　geolocation.clearWatch

　　7、参数

　　　　geolocationSuccess

　　　　geolocationError

　　　　geolocationOptions

二、 geolocation.getCurrentPosition

　　1、返回设备的当前位置，一个位置对象。

　　　　navigator.geolocation.getCurrentPosition(geolocationSuccess, [geolocationError], [geolocationOptions]);

　2、参数

　　　　geolocationSuccess：通过当前位置的回调。

　　　　geolocationError：（可选）如果发生错误，执行的回调。

　　　　geolocationOptions：（可选）获取地理位置的选项，例如获取频率。它一般作为一个 JSON 对象，目前可设置的属性如下

　　　　　　geolocationOptions{ enableHighAccuracy：提供一个表明应用程序希望获得最佳可能结果的提示。

　　　　　　timeout：允许的以毫秒为单位的最大时间间隔，该时间间隔是从 geolocation.getCurrentPosition 或 geolocation.watchPosition 的调用到相应的

　　　　　　geolocationSuccess 回调函数被调用，单位是毫秒。

　　　　　　maximumAge：保留上次缓存的最长时间，单位是毫秒。可以理解为获取地理位置信息的频率

　　3、注意：除非 enableHighAccuracy 选项被设定为 true，否则 Android 2.X 模拟器不会返回一个地理位置结果例如：

　　　　{ maximumAge: 3000, timeout: 5000, enableHighAccuracy: true }; }

三、包含当前地理位置坐标信息的Position对象描述

　　　　1、Position 包含由 geolocation API 创建的 Position 坐标信息。

　　　　　　　　coords：一系列地理坐标。（Coordinates 类型）

　　　　　　　　timestamp：以毫秒为单位的 coords 的创建时间戳。

　　　　2、PositionError 当发生错误时，一个 PositionError 对象会传递给 geolocationError 回调函数。

　　　　　　code：一个在下面常量列表中定义的错误代码。

　　　　　　message：说明错误细节的错误信息。

　　　　　　　　PositionError.PERMISSION_DENIED：权限被拒绝

　　　　　　　　PositionError.POSITION_UNAVAILABLE：位置不可用

　　　　　　　　PositionError.TIMEOUT：超时

　　　　3、 Coordinates 一系列用来描述位置的地理坐标信息的属性。

　　　　　　latitude：以十进制表示的纬度。

　　　　　　longitude：以十进制表示的经度。

　　　　　　altitude：位置相对于椭圆球面的高度，单位为米。海拔高度　　

　　　　　　accuracy：以米为单位的纬度和经度坐标的精度水平。

　　　　　　altitudeAccuracy：以米为单位的高度坐标的精度水平。（Android 设备上不支持该属性，返回值总是 nul）

　　　　　　heading：运动的方向，通过相对正北做顺时针旋转的角度指定。

　　　　　　speed：以米/秒为单位的设备当前地面速度。

四、获取地理位置信息

<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>phonegap_device_network_notification01</title>
<link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/>
<script src="../jquery.js" type="text/javascript"></script>
<script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script>
<script src="../cordova.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">

    // 等待PhoneGap加载
    document.addEventListener("deviceready", onDeviceReady, false);

    // 加载完成
    function onDeviceReady() {
        navigator.geolocation.getCurrentPosition(onSuccess, onError,{ maximumAge: 3000, timeout: 100000, enableHighAccuracy: true });
    }

    // onSuccess 回调函数
    //  接收包含当前地理位置坐标信息的Position对象
    function onSuccess(position) {
    alert(position.coords.latitude);
        var element = document.getElementById('geolocation');
        element.innerHTML = '纬度: '           + position.coords.latitude              + '<br />' +
                            '经度: '          + position.coords.longitude             + '<br />' +
                            '海拔高度: '           + position.coords.altitude              + '<br />' +
                            '精确度: '           + position.coords.accuracy              + '<br />' +
                            '海拔高度精确度: '  + position.coords.altitudeAccuracy      + '<br />' +
                            '运动方向: '            + position.coords.heading               + '<br />' +
                            '速度: '              + position.coords.speed                 + '<br />' +
                            '时间戳: '          + new Date(position.timestamp)          + '<br />';
    }

    // onError 回调函数， 接收包含具体错误信息的PositionError 对象
    function onError(error) {
        alert('错误代码: '    + error.code    + '
' + '详细信息: ' + error.message + '
');
    }

    </script>

</head> 
<body>
<div data-role="page">
        <div data-role="header">
            <h1>PhoneGap100实战</h1>
        </div>
        <div data-role="content">
            <p id="geolocation">定位中。。。</p>        
        </div>        
        <div data-role="footer">
            <h4>&nbsp;</h4>
        </div>
</div>

</body>
</html>

五、动态获取地理位置信息

　　1. geolocation.watchPosition 定期获取设备的地理位置信息

　　　　　　navigator.geolocation.watchPosition(onSuccess, onError, options);

　　 2. navigator.geolocation.clearWatch 停止定期获取设备的地理位置信息

<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>phonegap_device_network_notification01</title>
<link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/>
<script src="../jquery.js" type="text/javascript"></script>
<script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script>
<script src="../cordova.js" type="text/javascript"></script>
 <script type="text/javascript" charset="utf-8">

    //等待PhoneGap加载
    document.addEventListener("deviceready", onDeviceReady, false);

    var watchID = null;

    //加载完成
    function onDeviceReady() {
        // Update every 3 seconds
        var options = { frequency: 3000 };
        watchID = navigator.geolocation.watchPosition(onSuccess, onError, options);
    }

    // onSuccess 回调函数
    //  接收包含当前地理位置坐标信息的Position对象
    function onSuccess(position) {
        var element = document.getElementById('geolocation');
        element.innerHTML = '纬度: '  + position.coords.latitude      + '<br />' +
                            '经度: ' + position.coords.longitude     + '<br />' +
                            '<hr />'      + element.innerHTML;
    }

    //取消获取地理位置信息
    function clearWatch() {
        if (watchID != null) {
            navigator.geolocation.clearWatch(watchID);
            watchID = null;
        }
    }

    // onError 回调函数， 接收包含具体错误信息的PositionError 对象
    function onError(error) {
      alert('code: '    + error.code    + '
' +
            'message: ' + error.message + '
');
    }

    </script>

</head> 
<body>
<div data-role="page">
        <div data-role="header">
            <h1>PhoneGap100实战</h1>
        </div>
        <div data-role="content">
            <p id="geolocation">监测地理位置信息中。。。</p>
            <button onclick="clearWatch();">取消监测地理位置信息</button>    
        </div>        
        <div data-role="footer">
            <h4>&nbsp;</h4>
        </div>
</div>

</body>
</html>