html5實現獲取地理位置資訊並定位
這裡主要講h5實現獲取地理位置資訊並定位功能，本文講解了原生h5，百度地圖，谷歌地圖等三種獲取地理資訊並定位的方法，需要的朋友可以參考下：
h5提供了地理位置功能（Geolocation API),能確定使用者位置，我們可以藉助h5的該特性開發基於地理位置資訊的應用，本文集合實力給大家分享下如何使用h5，藉助百度，谷歌地圖介面來獲取使用者準確的地理位置資訊。
如何使用h5地理位置定位功能
定位功能（Geolocation）是HTML5的新特性，因此只有在支援HTML5的現代瀏覽器上執行，特別是手持裝置如iphone，地理定位更加精確。首先我們要檢測使用者裝置瀏覽器是否支援地理定位，如果支援則獲取地理資訊。注意這個特性可能侵犯使用者的隱私，除非使用者同意，否則使用者位置資訊是不可用的，所以我們在訪問該應用時會提示是否允許地理定位，我們當然選擇允許即可。
|
|
上面的程式碼可以知道，如果使用者裝置支援地理定位，則執行 getCurrentPosition() 如果getCurrentPosition()執行成功，則向引數showPosition中規定的函式返回一個coordinates物件，getCurrentPosition() 方法的第二個引數showError用於處理錯誤，它規定當獲取使用者位置失敗時執行的函式。
我們先來看一下函式showError(),它規定獲取使用者地理位置失敗時的一些錯誤程式碼處理方式：
|
showError(error){
|
我們再來看函式showPosition(),呼叫coords的latitude和longitude即可獲取到使用者的緯度和經度。
|
|
利用百度地圖和谷歌地圖介面獲取使用者地址
上面我們瞭解了HTML5的Geolocation可以獲取使用者的經緯度，那麼我們要做的是需要把抽象的經緯度轉成可讀的有意義的真正的使用者地理位置資訊。幸運的是百度地圖和谷歌地圖等提供了這方面的介面，我們只需要將HTML5獲取到的經緯度資訊傳給地圖介面，則會返回使用者所在的地理位置，包括省市區資訊，甚至有街道、門牌號等詳細的地理位置資訊。
我們首先在頁面定義要展示地理位置的div，分別定義id#baidu_geo和id#google_geo。我們只需修改關鍵函式showPosition()。先來看百度地圖介面互動，我們將經緯度資訊通過Ajax方式傳送給百度地圖介面，介面會返回相應的省市區街道資訊。百度地圖介面返回的是一串JSON資料，我們可以根據需求將需要的資訊展示給div#baidu_geo。注意這裡用到了jQuery庫，需要先載入jQuery庫檔案。
|
|
再來看谷歌地圖介面互動。同樣我們將經緯度資訊通過Ajax方式傳送給谷歌地圖介面，介面會返回相應的省市區街道詳細資訊。谷歌地圖介面返回的也是一串JSON資料，這些JSON資料比百度地圖介面返回的要更詳細，我們可以根據需求將需要的資訊展示給div#google_geo。
|
|
以上的程式碼分別將百度地圖介面和谷歌地圖介面整合到函式showPosition()中，我們可以根據實際情況進行呼叫。