1. 程式人生 > >HTML5+規範:Geolocation(管理設備位置信息) 定位

HTML5+規範:Geolocation(管理設備位置信息) 定位

get poi 配置 orcal eol 平臺 1.2 system git

Geolocation模塊管理設備位置信息,用於獲取地理位置信息,如經度、緯度等。通過plus.geolocation可獲取設備位置管理對象。雖然W3C已經提供標準API獲取位置信息,但在某些平臺存在差異或未實現,為了保持各平臺的統一性,定義此規範接口獲取位置信息。

1、方法

1.1、getCurrentPosition: 獲取當前設備位置信息

void plus.geolocation.getCurrentPosition( successCB, errorCB, option );

說明:位置信息將通過手機GPS設備或其它信息如IP地址、移動網絡信號獲取,由於獲取位置信息可能需要較長的時間,當成功獲取位置信息後將通過successCB回調函數返回。

參數:

successCB: ( GeolocationSuccessCallback ) 必選 獲取設備位置信息成功回調函數

errorCB: ( GeolocationErrorCallback ) 可選 獲取設備位置信息失敗回調函數

option: ( PositionOptions ) 可選 獲取設備位置信息的參數

返回值:void : 無

平臺支持:Android - 2.2+ (支持): 支持、iOS - 4.3+ (支持): 支持

示例:

[html] view plain copy print?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Geolocation Example</title>
  6. <script type="text/javascript" >
  7. // 擴展API加載完畢後調用onPlusReady回調函數
  8. document.addEventListener( "plusready", onPlusReady, false );
  9. // 擴展API加載完畢,現在可以正常調用擴展API
  10. function onPlusReady() {
  11. plus.geolocation.getCurrentPosition( function ( p ) {
  12. alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
  13. }, function ( e ) {
  14. alert( "Geolocation error: " + e.message );
  15. } );
  16. }
  17. </script>
  18. </head>
  19. <body >
  20. </body>
  21. </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Geolocation Example</title>
<script type="text/javascript" >
// 擴展API加載完畢後調用onPlusReady回調函數
document.addEventListener( "plusready", onPlusReady, false );
// 擴展API加載完畢,現在可以正常調用擴展API
function onPlusReady() {
plus.geolocation.getCurrentPosition( function ( p ) {
alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
}, function ( e ) {
alert( "Geolocation error: " + e.message );
} );
}
</script>
</head>
<body >
</body>
</html>

1.2、watchPosition: 監聽設備位置變化信息

Number plus.geolocation.watchPosition( successCB, errorCB, option );

說明:位置信息將通過手機GPS設備或其它信息如IP地址、移動網絡信號獲取。當位置信息更新後將通過successCB回調函數返回。位置信息獲取失敗則調用回調函數errorCB。

參數:

successCB: ( GeolocationSuccessCallback ) 必選 設備位置信息更新成功回調函數

errorCB: ( GeolocationErrorCallback ) 可選 獲取設備位置信息失敗回調函數

option: ( PositionOptions ) 可選 監聽設備位置信息的參數

返回值:Number : 用於標識位置信息監聽器,可通過clearWatch方法取消監聽。

平臺支持:Android - 2.2+ (支持): 支持,iOS - 4.3+ (支持): 支持

示例:

[html] view plain copy print?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Geolocation Example</title>
  6. <script type="text/javascript" >
  7. // 擴展API加載完畢後調用onPlusReady回調函數
  8. document.addEventListener( "plusready", onPlusReady, false );
  9. // 擴展API加載完畢,現在可以正常調用擴展API
  10. function onPlusReady() {
  11. plus.geolocation.watchPosition( function ( a ) {
  12. alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
  13. }, function ( e ) {
  14. alert( "Geolocation error: " + e.message );
  15. } );
  16. }
  17. </script>
  18. </head>
  19. <body >
  20. </body>
  21. </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Geolocation Example</title>
<script type="text/javascript" >
// 擴展API加載完畢後調用onPlusReady回調函數
document.addEventListener( "plusready", onPlusReady, false );
// 擴展API加載完畢,現在可以正常調用擴展API
function onPlusReady() {
plus.geolocation.watchPosition( function ( a ) {
alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
}, function ( e ) {
alert( "Geolocation error: " + e.message );
} );
}
</script>
</head>
<body >
</body>
</html>

1.3、clearWatch: 關閉監聽設備位置信息

void plus.geolocation.clearWatch( watchId );

參數:watchId: ( Number ) 必選 需要取消的位置監聽器標識,調用watchPosition方法的返回值。

返回值:void : 無

平臺支持:Android - 2.2+ (支持): 支持,iOS - 4.3+ (支持): 支持

示例:

[html] view plain copy print?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Geolocation Example</title>
  6. <script type="text/javascript" >
  7. // 擴展API加載完畢後調用onPlusReady回調函數
  8. document.addEventListener( "plusready", onPlusReady, false );
  9. // 擴展API加載完畢,現在可以正常調用擴展API
  10. var wid = null;
  11. function onPlusReady() {
  12. wid = plus.geolocation.watchPosition( function ( p ) {
  13. alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
  14. }, function ( e ) {
  15. alert( "Geolocation error: " + e.message );
  16. } );
  17. }
  18. function cancel() {
  19. plus.geolocation.clearWatch( wid );
  20. wid = null;
  21. }
  22. </script>
  23. </head>
  24. <body >
  25. <input type="button" value="Cancel" onclick="cancel();" ></input>
  26. </body>
  27. </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Geolocation Example</title>
<script type="text/javascript" >
// 擴展API加載完畢後調用onPlusReady回調函數
document.addEventListener( "plusready", onPlusReady, false );
// 擴展API加載完畢,現在可以正常調用擴展API
var wid = null;
function onPlusReady() {
wid = plus.geolocation.watchPosition( function ( p ) {
alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
}, function ( e ) {
alert( "Geolocation error: " + e.message );
} );
}
function cancel() {
plus.geolocation.clearWatch( wid );
wid = null;
}
</script>
</head>
<body >
<input type="button" value="Cancel" onclick="cancel();" ></input>
</body>
</html>

2、對象

2.1、Position: JSON對象,設備位置信息數據

interface Position {

readonly attribute Coordinates coords;

readonly attribute String coordsType;

readonly attribute Number timestamp;

readonly attribute Address address;

readonly attribute String addresses;

}

屬性:

(1)、coords: (Coordinates 類型 )地理坐標信息,包括經緯度、海拔、速度等信息

(2)、coordsType: (String 類型 )獲取到地理坐標信息的坐標系類型,可取以下坐標系類型: “gps”:表示WGS-84坐標系; “gcj02”:表示國測局經緯度坐標系; “bd09”:表示百度墨卡托坐標系; “bd09ll”:表示百度經緯度坐標系。

(3)、timestamp: (Number 類型 )獲取到地理坐標的時間戳信息,時間戳值為從1970年1月1日至今的毫秒數。

(4)、address: (Address 類型 )獲取到地理位置對應的地址信息,獲取地址信息需要連接到服務器進行解析,所以會消耗更多的資源,如果不需要獲取地址信息可通過設置PositionOptions參數的geocode屬性值為false避免獲取地址信息。 如果沒有獲取到地址信息則返回undefined。平臺支持Android - 2.3+ (支持): 使用系統定位模塊無法獲取位置信息。iOS - 5.1+ (支持): 系統定位模塊也支持獲取位置信息。

(5)、addresses: (String 類型 )獲取完整地址描述信息。如果沒有獲取到地址信息則返回undefined。平臺支持Android - 2.3+ (支持): 使用系統定位模塊無法獲取位置信息。iOS - 5.1+ (支持): 系統定位模塊也支持獲取位置信息。

2.2、Address: JSON對象,地址信息

interface Address {

readonly attribute String country;

readonly attribute String province;

readonly attribute String city;

readonly attribute String district;

readonly attribute String street;

readonly attribute String poiName;

readonly attribute String postalCode;

readonly attribute String cityCode;

}

屬性:

(1)、country: (String 類型 )國家。如“中國”,如果無法獲取此信息則返回undefined。

(2)、province: (String 類型 )省份名稱。如“北京市”,如果無法獲取此信息則返回undefined。

(3)、city: (String 類型 )城市名稱。如“北京市”,如果無法獲取此信息則返回undefined。

(4)、district: (String 類型 )區(縣)名稱。如“朝陽區”,如果無法獲取此信息則返回undefined。

(5)、street: (String 類型 )街道和門牌信息。如“酒仙橋路”,如果無法獲取此信息則返回undefined。

(6)、poiName: (String 類型 )POI信息。如“電子城.國際電子總部”,如果無法獲取此信息則返回undefined。

(7)、postalCode: (String 類型 )郵政編碼。如“100016”,如果無法獲取此信息則返回undefined。

(8)、cityCode: (String 類型 )城市代碼。如“010”,如果無法獲取此信息則返回undefined。

2.3、Coordinates: JSON對象,地理坐標信息

interface Coordinates {

readonly attribute double latitude;

readonly attribute double longitude;

readonly attribute double altitude;

readonly attribute double accuracy;

readonly attribute double altitudeAccuracy;

readonly attribute double heading;

readonly attribute double speed;

}

屬性:

(1)、latitude: (Number 類型 )坐標緯度值。數據類型對象,地理坐標中的緯度值。

(2)、longitude: (Number 類型 )坐標經度值。數據類型對象,地理坐標中的經度值。

(3)、altitude: (Number 類型 )海拔信息。數據類型對象,如果無法獲取此信息,則此值為空(null)。

(4)、accuracy: (Number 類型 )地理坐標信息的精確度信息。數據類型對象,單位為米,其有效值必須大於0。

(5)、altitudeAccuracy: (Number 類型 )海拔的精確度信息。數據類型對象,單位為米,其有效值必須大於0。如果無法獲取海拔信息,則此值為空(null)。

(6)、heading: (Number 類型 )表示設備移動的方向。數據類型對象,範圍為0到360,表示相對於正北方向的角度。如果無法獲取此信息,則此值為空(null)。如果設備沒有移動則此值為NaN。

(7)、speed: (Number 類型 )表示設備移動的速度。數據類型對象,單位為米每秒(m/s),其有效值必須大於0。如果無法獲取速度信息,則此值為空(null)。

2.4、PositionOptions: JSON對象,監聽設備位置信息參數

屬性:

(1)、enableHighAccuracy: (Boolean 類型 )是否高精確度獲取位置信息。高精度獲取表示需要使用更多的系統資源,默認值為false。

(2)、timeout: (Number 類型 )獲取位置信息的超時時間。單位為毫秒(ms),默認值為不超時。如果在指定的時間內沒有獲取到位置信息則觸發錯誤回調函數。

(3)、maximumAge: (Number 類型 )獲取位置信息的緩存時間。單位為毫秒(ms),默認值為0(立即更新獲取)。如果設備緩存的位置信息超過指定的緩存時間,將重新更新位置信息後再返回。

(4)、provider: (String 類型 )優先使用的定位模塊。可取以下供應者: "system":表示系統定位模塊,支持wgs84坐標系; "baidu":表示百度定位模塊,支持gcj02/bd09/bd09ll坐標系; "amap":表示高德定位模板,支持gcj02坐標系。 默認值按以下優先順序獲取(amap>baidu>system),若指定的provider不存在或無效則返回錯誤回調。 註意:百度/高德定位模塊需要配置百度/高德地圖相關參數才能正常使用。平臺支持Android - 2.2+ (支持),iOS - 4.5+ (支持): provider為“baidu”時,僅支持bd09ll坐標系,暫不支持高德定位模塊。

[html] view plain copy print?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Geolocation Example</title>
  6. <script type="text/javascript" >
  7. // 擴展API加載完畢後調用onPlusReady回調函數
  8. document.addEventListener( "plusready", onPlusReady, false );
  9. // 擴展API加載完畢,現在可以正常調用擴展API
  10. function onPlusReady() {
  11. // 使用百度地圖地位模塊獲取位置信息
  12. plus.geolocation.getCurrentPosition( function ( p ) {
  13. alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
  14. }, function ( e ) {
  15. alert( "Geolocation error: " + e.message );
  16. },{provider:‘baidu‘});
  17. }
  18. </script>
  19. </head>
  20. <body >
  21. </body>
  22. </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Geolocation Example</title>
<script type="text/javascript" >
// 擴展API加載完畢後調用onPlusReady回調函數
document.addEventListener( "plusready", onPlusReady, false );
// 擴展API加載完畢,現在可以正常調用擴展API
function onPlusReady() {
// 使用百度地圖地位模塊獲取位置信息
plus.geolocation.getCurrentPosition( function ( p ) {
alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
}, function ( e ) {
alert( "Geolocation error: " + e.message );
},{provider:‘baidu‘});
}
</script>
</head>
<body >
</body>
</html>

(5)、coordsType: (String 類型 )指定獲取的定位數據坐標系類型。可取以下坐標系類型: “wgs84”:表示WGS-84坐標系; “gcj02”:表示國測局經緯度坐標系; “bd09”:表示百度墨卡托坐標系; “bd09ll”:表示百度經緯度坐標系; provider為“system”時,默認使用“wgs84”類型;provider為“baidu”是,默認使用“bd09ll”類型。 如果設置的坐標系類型provider不支持,則返回錯誤。

(6)、geocode: (Boolean 類型 )是否解析地址信息。解析的地址信息保存到Position對象的address、addresses屬性中,true表示解析地址信息,false表示不解析地址信息,返回的Position對象的address、addresses屬性值為undefined,默認值為true。 如果解析地址信息失敗則返回的Position對象的address、addresses屬性值為null。

2.5、GeolocationError: JSON對象,定位錯誤信息

interface GeolocationError {

const Number PERMISSION_DENIED = 1;

const Number POSITION_UNAVAILABLE = 2;

const Number TIMEOUT = 3;

const Number UNKNOWN_ERROR = 4;

readonly attribute Number code;

readonly attribute String message;

}

常量:

PERMISSION_DENIED: (Number 類型 )訪問權限被拒絕。系統不允許程序獲取定位功能,錯誤代碼常量值為1。

POSITION_UNAVAILABLE: (Number 類型 )位置信息不可用。無法獲取有效的位置信息,錯誤代碼常量值為2。

TIMEOUT: (Number 類型 )獲取位置信息超時。無法在指定的時間內獲取位置信息,錯誤代碼常量值為3。

UNKNOWN_ERROR: (Number 類型 )未知錯誤。其它未知錯誤導致無法獲取位置信息,錯誤代碼常量值為4。

屬性:

code: (Number 類型 )錯誤代碼。取值範圍為GeolocationError對象的常量值。

message: (String 類型 )錯誤描述信息。詳細錯誤描述信息。

3、回調方法

3.1、GeolocationSuccessCallback: 獲取設備位置信息成功的回調函數

void onSuccess( position ) {

// Get Position code.

}

參數:position: ( Position ) 必選 設備的地理位置信息,參考Position

返回值:void : 無

示例:

[html] view plain copy print?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Geolocation Example</title>
  6. <script type="text/javascript" >
  7. // 擴展API加載完畢後調用onPlusReady回調函數
  8. document.addEventListener( "plusready", onPlusReady, false );
  9. // 擴展API加載完畢,現在可以正常調用擴展API
  10. function onPlusReady() {
  11. plus.geolocation.getCurrentPosition( function ( p ) {
  12. alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
  13. console.log( "Geolocation info: " + JSON.stringify(p) );
  14. }, function ( e ) {
  15. console.log("Gelocation Error: code - "+e.code+"; message - "+e.message);
  16. } );
  17. }
  18. </script>
  19. </head>
  20. <body >
  21. </body>
  22. </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Geolocation Example</title>
<script type="text/javascript" >
// 擴展API加載完畢後調用onPlusReady回調函數
document.addEventListener( "plusready", onPlusReady, false );
// 擴展API加載完畢,現在可以正常調用擴展API
function onPlusReady() {
plus.geolocation.getCurrentPosition( function ( p ) {
alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
console.log( "Geolocation info: " + JSON.stringify(p) );
}, function ( e ) {
console.log("Gelocation Error: code - "+e.code+"; message - "+e.message);
} );
}
</script>
</head>
<body >
</body>
</html>

3.1、GeolocationErrorCallback: 獲取設備位置信息失敗的回調函數

function void onGeolocationError( GeolocationError error ) {

// Handle error

var code = error.code; // 錯誤編碼

var message = error.message; // 錯誤描述信息

}

參數:

error: ( GeolocationError ) 必選 獲取位置操作的錯誤信息,可通過error.code(Number類型)獲取錯誤編碼; 可通過error.message(String類型)獲取錯誤描述信息。

返回值:void : 無

示例:

[html] view plain copy print?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Geolocation Example</title>
  6. <script type="text/javascript" >
  7. // 擴展API加載完畢後調用onPlusReady回調函數
  8. document.addEventListener( "plusready", onPlusReady, false );
  9. // 擴展API加載完畢,現在可以正常調用擴展API
  10. function onPlusReady() {
  11. plus.geolocation.getCurrentPosition( function ( p ) {
  12. console.log( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
  13. }, function ( e ) {
  14. console.log("Gelocation Error: code - "+e.code+"; message - "+e.message);
  15. switch(e.code) {
  16. case e.PERMISSION_DENIED:
  17. alert("User denied the request for Geolocation.");
  18. break;
  19. case e.POSITION_UNAVAILABLE:
  20. alert("Location information is unavailable.");
  21. break;
  22. case e.TIMEOUT:
  23. alert("The request to get user location timed out.");
  24. break;
  25. case e.UNKNOWN_ERROR:
  26. alert("An unknown error occurred.");
  27. break;
  28. }
  29. } );
  30. }
  31. </script>
  32. </head>
  33. <body >
  34. </body>
  35. </html>

HTML5+規範:Geolocation(管理設備位置信息) 定位