`
lixinlixin2008
  • 浏览: 150092 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

如何在 Mobile Web App 中取得经纬度(转)

阅读更多
转载自ericsk ,地址如下:http://blog.ericsk.org/archives/1347/comment-page-1


以下为转载内容:

本篇文章提及的方法僅適用於 iPhone 3.0+ 及 Android-based 手機。

在寫 mobile web app 時,如果使用者是用 iPhone 3.0+ 或是 Android-based 手機來瀏覽網站時,其實還是有辦法取得手機的經緯度座標資料。以下先分別講述兩支手機各別的方法,然後再將兩個方法合成同一份 JavaScript 程式碼。
iPhone

iPhone 3.0 之後,iPhone Safari 直接支援 Geolocation API,所以你可以利用下面這段 JavaScript 程式碼來取得該 iPhone 的經緯度座標資料:

var getPosition = function(pos) {
    // pos.coords.latitude 及 pos.coords.longitude 即為座標資料
};
var errorCallback = function(error) {
    // 定位失敗,可能是無法定位或是使用者關閉手機的定位服務
};
navigator.geolocation.getCurrentPosition(getPosition,
    errorCallback, {enableHighAccuracy: true});


Android-based

在目前 Android-based 的手機上,瀏覽器還不直接支援 Geolocation API,但是 Android-based 手機的瀏覽器都預先安裝好了 Google Gears,所以也可以透過 Google Gears 所提供的 Geolocation API 來取得座標資料:

// 先載入 Google Gears JS lib: 
// http://code.google.com/apis/gears/gears_init.js


....
if (window.google && google.gears) {
    try {
        var geo = google.gears.factory.create('beta.location');
        geo.getCurrentPosition(getPosition,
            errorCallback, {enableHighAccuracy: true});
    } catch (e) {
        // error
    }
}


呼叫的方式與原生支援的 Geolocation API 一模一樣。
加入 IP-based Geolocation 支援

如果利用原生的 Geolocation API 或是 Google Gears 取得座標資料失敗時,其實還可以再使用 IP 作定位的動作,這時可以利用 Google AJAX API Loader 來作:

// 先載入 http://www.google.com/jsapi 取得 google ajax api loader
...
if (google.loader.ClientLocation) {
    // google.loader.ClientLocation.latitude
    // google.loader.ClientLocation.longitude
}

全部放在一起

最後,如果要把這些 code 全部放在一起,那就有可能會是這樣:

// 先載入:
// http://www.google.com/jsapi?key=去申請
// 還有 http://code.google.com/apis/gears/gears_init.js

....
....
var getPosition = function(pos) {
    // pos.coords.latitude 及 pos.coords.longitude 即為座標資料
};
var errorCallback = function(error) {
    fallbackToIPGeoLocation();
};
var fallbackToIPGeoLocation = function() {
    if (google.loader.ClientLocation) {
        // google.loader.ClientLocation.latitude
        // google.loader.ClientLocation.longitude
    } else {
        // 投降了,真的無法定位
    }
};
if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(getPosition,
        errorCallback, {enableHighAccuracy: true});
} else {
    if (window.google && google.gears) {
        try {
            var geo = google.gears.factory.create('beta.location');
            geo.getCurrentPosition(getPosition,
                errorCallback, {enableHighAccuracy: true});
        } catch (e) {
            fallbackToIPGeoLocation();
        }
    } else {
        fallbackToIPGeoLocation();
    }
}


如此一來便能在 mobile web app 中取得手機的經緯度座標資料了!
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics