PhoneGap Geolocation 獲取地理位置 api

時間 2019-11-30

標籤 phonegap geolocation 獲取地理位置 api 简体版

原文原文鏈接

1、 PhoneGap Geolocation 對象介紹javascript

　　一、使應用程序能夠訪問地理位置信息。geolocation 對象提供了對設備 GPS 傳感器的訪問。Geolocation 提供設備的位置信息，例如經度和緯度。css

　　二、位置信息的常見來源包括全球定位系統（GPS），以及經過諸如 IP 地址、RFID、WiFi 和藍牙的 MAC 地址、和 GSM/CDMA 手機 ID 的網絡信號所作的推斷。html

　　三、不能保證該 API 返回的是設備的真實位置信息。這個 API 是基於 W3C Geo location API Specification 實現的。java

　　四、有些設備已經提供了對該規範的實現，對於這些設備採用內置實現而非使用 PhoneGap 的實現。jquery

　　五、對於沒有地理位置支持的設備，PhoneGap 提供了統一的支持。git

　　六、方法緩存

　　　　geolocation.getCurrentPosition網絡

　　　　geolocation.watchPosition函數

　　　　geolocation.clearWatchspa

　　七、參數

　　　　geolocationSuccess

　　　　geolocationError

　　　　geolocationOptions

2、 geolocation.getCurrentPosition

　　一、返回設備的當前位置，一個位置對象。

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

　二、參數

　　　　geolocationSuccess：經過當前位置的回調。

　　　　geolocationError：（可選）若是發生錯誤，執行的回調。

　　　　geolocationOptions：（可選）獲取地理位置的選項，例如獲取頻率。它通常做爲一個 JSON 對象，目前可設置的屬性以下

　　　　　　geolocationOptions{ enableHighAccuracy：提供一個代表應用程序但願得到最佳可能結果的提示。

　　　　　　timeout：容許的以毫秒爲單位的最大時間間隔，該時間間隔是從 geolocation.getCurrentPosition 或 geolocation.watchPosition 的調用到相應的

　　　　　　geolocationSuccess 回調函數被調用，單位是毫秒。

　　　　　　maximumAge：保留上次緩存的最長時間，單位是毫秒。能夠理解爲獲取地理位置信息的頻率

　　三、注意：除非 enableHighAccuracy 選項被設定爲 true，不然 Android 2.X 模擬器不會返回一個地理位置結果例如：

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

3、包含當前地理位置座標信息的Position對象描述

　　　　一、Position 包含由 geolocation API 建立的 Position 座標信息。

　　　　　　　　coords：一系列地理座標。（Coordinates 類型）

　　　　　　　　timestamp：以毫秒爲單位的 coords 的建立時間戳。

　　　　二、PositionError 當發生錯誤時，一個 PositionError 對象會傳遞給 geolocationError 回調函數。

　　　　　　code：一個在下面常量列表中定義的錯誤代碼。

　　　　　　message：說明錯誤細節的錯誤信息。

　　　　　　　　PositionError.PERMISSION_DENIED：權限被拒絕

　　　　　　　　PositionError.POSITION_UNAVAILABLE：位置不可用

　　　　　　　　PositionError.TIMEOUT：超時

　　　　三、 Coordinates 一系列用來描述位置的地理座標信息的屬性。

　　　　　　latitude：以十進制表示的緯度。

　　　　　　longitude：以十進制表示的經度。

　　　　　　altitude：位置相對於橢圓球面的高度，單位爲米。海拔高度　　

　　　　　　accuracy：以米爲單位的緯度和經度座標的精度水平。

　　　　　　altitudeAccuracy：以米爲單位的高度座標的精度水平。（Android 設備上不支持該屬性，返回值老是 nul）

　　　　　　heading：運動的方向，經過相對正北作順時針旋轉的角度指定。

　　　　　　speed：以米/秒爲單位的設備當前地面速度。

4、獲取地理位置信息

<!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    + '\n' + '詳細信息: ' + error.message + '\n');
    }

    </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>

5、動態獲取地理位置信息

　　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    + '\n' +
            'message: ' + error.message + '\n');
    }

    </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>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。