HTML5如何實(shí)現(xiàn)地理位置的獲取

這篇文章運(yùn)用簡單易懂的例子給大家介紹HTML5如何實(shí)現(xiàn)地理位置的獲取，代碼非常詳細(xì)，感興趣的小伙伴們可以參考借鑒，希望對(duì)大家能有所幫助。

獲取地理位置的原理

大部分的設(shè)備分享地理位置需要用戶權(quán)限，那么設(shè)備是怎么識(shí)別地理位置的呢？大致有如下兩種方式：

1. 通過移動(dòng)端的IP地址進(jìn)行定位（包括WiFi，CDMA等）。

2. 通過衛(wèi)星定位獲得經(jīng)緯度信息的 GPS 設(shè)備。

首先我們需要設(shè)置調(diào)用函數(shù)來申請(qǐng)獲取權(quán)限，然后利用回調(diào)函數(shù)獲取地理位置信息，最后對(duì)于輸出結(jié)果我們要進(jìn)行容錯(cuò)處理。

獲取地理位置的步驟

步驟一：調(diào)用位置函數(shù)

function get_location() {
  navigator.geolocation.getCurrentPosition(show_map, handle_error, PositionOptions);
}

步驟二：獲取地理位置

function show_map(position) {
  var latitude = position.coords.latitude;//獲取緯度
  var longitude = position.coords.longitude;//獲取經(jīng)度
}

其中這個(gè)回調(diào)函數(shù)要傳入一個(gè) position 對(duì)象，就是獲取到的位置信息。position屬性如圖所示

步驟三：容錯(cuò)處理

function handle_error(err) {
  switch(err.code)  {
    case err.PERMISSION_DENIED:
      break;
    case err.POSITION_UNAVAILABLE:
      break;
    case err.TIMEOUT:
      break;
    case err.UNKNOWN_ERROR:
      break;
  }
}

在此列出了四種錯(cuò)誤情況

1. 用戶拒絕對(duì)獲取地理位置的請(qǐng)求。

2. 位置信息不可用。

3. 請(qǐng)求地理位置信息超時(shí)。

4. 未知錯(cuò)誤。

關(guān)于HTML5如何實(shí)現(xiàn)地理位置的獲取就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到。