js獲取地理位置資訊簡單介紹
本章節介紹一下如何利用javascript獲取地理位置資訊,這個需求當前也是非常廣泛的。
檢查你的瀏覽器是否支援地理位置資訊API:
目前主流的瀏覽器都已經對JavaScript地理位置資訊API有了較好的支援。
但如果你還不放心,那麼,確認地理位置資訊API支援情況最好的方式是瀏覽器的功能特徵測試。
[JavaScript] 純文字檢視 複製程式碼if("geolocation" in navigator) { //w00t! } else { alert("很不幸!你的瀏覽器並不支援Geolocation API功能"); }
對於判斷瀏覽器是否支援地理位置API,最主要的就是看看navigator.geolocation這個物件,使用in,而不是簡單的使用if(navigator.geolocation),這一點非常重要,因為後者有可能會因此初始化地理位置資訊物件,從而佔用/鎖定了裝置資源。
查詢地理位置資訊:
這個navigator.geolocation.getCurrentPosition方法是獲取詳細位置資訊最關鍵的一個介面:
[JavaScript] 純文字檢視 複製程式碼if("geolocation" in navigator) { navigator.geolocation.getCurrentPosition(function(position) { console.log(position); }); }
一旦你呼叫了這個方法(如果請求成功,它會執行你在引數裡提供的回撥方法),瀏覽器會詢問使用者是否允許程式獲取他們的地理位置資訊。
當使用者執行網頁獲取他們的位置資訊後,瀏覽器就可以開始讀取地理資訊,它會返回給你一個位置資訊物件,物件的結構基本是這樣的:
[JavaScript] 純文字檢視 複製程式碼// "Position" object { coords: { "Coordinates" object accuracy: 65, altitude: 294.4074401855469, altitudeAccuracy: 10, heading: -1, latitude: 43.01256284360166, longitude: -89.44531987692744, speed: -1 }, timestamp: 1429722992094269 }
相關文章
- js獲取瀏覽器相關資訊簡單介紹JS瀏覽器
- jquery獲取json資料簡單介紹jQueryJSON
- js獲取元素的樣式值簡單介紹JS
- js和jQuery獲取視窗和元素尺寸簡單介紹JSjQuery
- 原生javascript獲取dom元素簡單介紹JavaScript
- js獲取滑鼠在頁面中的座標簡單介紹JS
- JSON簡單介紹JSON
- nodejs簡單介紹NodeJS
- html5獲取地理位置資訊APIHTMLAPI
- JSON物件簡單介紹JSON物件
- js WebSocket用法簡單介紹JSWeb
- IE瀏覽器下js無法獲取隱藏圖片尺寸簡單介紹瀏覽器JS
- js設定、讀取或者刪除cookie簡單介紹JSCookie
- javascript獲取數字中最大的一個簡單介紹JavaScript
- jquery實現的倒數獲取li元素簡單介紹jQuery
- HTML5獲取圖片的原始高度簡單介紹HTML
- Caffeine快取的簡單介紹快取
- js字串連線簡單介紹JS字串
- js cookie路徑簡單介紹JSCookie
- js 特權方法簡單介紹JS
- js短路運算簡單介紹JS
- js與&&運算子簡單介紹JS
- jQuery iframe子視窗獲取父視窗元素簡單介紹jQuery
- 前臺怎樣獲取後臺ajax資料簡單介紹
- js如何阻止表單提交簡單介紹JS
- javascript取模運算簡單介紹JavaScript
- Python獲取IP地址對應的地理位置資訊!Python
- js根據ip地址獲取城市地理位置JS
- 使用JS獲取當前地理位置方法彙總JS
- 簡單介紹一下 JSONJSON
- angularJS的router用法簡單介紹AngularJS
- js style.cssText用法簡單介紹JSCSS
- js事件委託原理簡單介紹JS事件
- js isPrototypeOf()函式用法簡單介紹JS函式
- node.js操作mongodb簡單介紹Node.jsMongoDB
- ReactJs環境配置簡單介紹ReactJS
- require.js的作用簡單介紹UIJS
- 是什麼JSON,簡單介紹JSON