DIV CSS 佈局教程網

基於地理位置的應用越來越火，Html5也提供了地理位置API。本章充數的文字比較多，不過還是有些內容的。

獲取地理位置的方式及其優缺點：

1、ip地址

書上說不准確，很多時候獲取的是ISP機房的位置，但是獲取非常方便，沒有什麼限制。但是實際上我覺得在中國，ip地址還是比較准確的，基本上上能精確到小區或大樓的標准。

2、GPS

非常准確，但是需要在戶外，且需要很長時間搜索衛星。最主要的很多設備比如筆記本電腦基本都是不帶GPS的，新的智能手機倒是都有。

3、WiFi基站的Mac地址。（猜測是連接位置已知的公共WiFi的時候，通過Mac地址識別WiFi接入點，從而定位)

這種定位的精度還是很不錯的，而且還可以在室內定位。不過由於這種位置公開的wifi比較少，此種方法的適用范圍比較少。

4、 GSM或CDMA基站

通過基站定位，精度隨基站密度變化，精度一般，還是只有手機能用。看來地理位置API還是手機上比較有實用性。

5、用戶指定位置

暈，這個就不是Html5的范疇了。

地理位置獲取流程：

1、用戶打開需要獲取地理位置的web應用。

2、應用向浏覽器請求地理位置，浏覽器彈出詢問窗口，詢問用戶是否共享地理位置。

3、假設用戶允許，浏覽器從設別查詢相關信息。

4、浏覽器將相關信息發送到一個信任的位置服務器，服務器返回具體的地理位置。

檢測浏覽器支持：

JavaScript Code復制內容到剪貼板

1. function loadDemo() {  
2. if(navigator.geolocation) {  
3. document.getElementById(“support”).innerHTML = “Html5 Geolocation supported.”;  
4.   
5. } else {  
6. document.getElementById(“support”).innerHTML = “Html5 Geolocation is not supported in  
7. your browser.”;  
8. }  
9. }  

位置請求方式：

單次請求

JavaScript Code復制內容到剪貼板

1. navigator.geolocation.getCurrentPosition(updateLocation, handleLocationError, options);  

回調函數updateLocation接受一個對象參數，表示當前的地理位置，它有如下屬性：

latitude——緯度
longitude——精度
accuracy——精確度，單位米
altitude——高度，單位米
altitudeAccuracy——高度的精確地，單位米
heading—運動的方向，相對於正北方向的角度
speed——運動的速度（假設你在地平線上運動），單位米/秒

回調函數handleLocationError接受錯誤對象，error.code是如下錯誤號。

UNKNOWN_ERROR (error code 0) —— 錯誤不在如下三種之內，你可以使用error.message獲取錯誤詳細信息。
PERMISSION_DENIED (error code 1)—— 用不選擇不共享地理位置
POSITION_UNAVAILABLE (error code 2) ——無法獲取當前位置
TIMEOUT (error code 3) ——在指定時間無法獲取位置會觸發此錯誤。

第三個參數options是可選參數，屬性如下：

enableHighAccuracy——指示浏覽器獲取高精度的位置，默認為false。當開啟後，可能沒有任何影響，也可能使浏覽器花費更長的時間獲取更精確的位置數據。
timeout——指定獲取地理位置的超時時間，默認不限時。單位為毫秒。
maximumAge——最長有效期，在重復獲取地理位置時，此參數指定多久再次獲取位置。默認為0，表示浏覽器需要立刻重新計算位置。

參數使用的例子如下：

JavaScript Code復制內容到剪貼板

1. navigator.geolocation.getCurrentPosition(updateLocation,handleLocationError,  
2. {timeout:10000});  

重復請求

navigator.geolocation.watchPosition(updateLocation, handleLocationError);
使用 watchPosition可以持續獲取地理位置，浏覽器或多次調用updateLocation函數以便傳遞最新的位置。該函數返回一個watchID，使用navigator.geolocation.clearWatch(watchId)可以清除此次回調，使用不帶參數的navigator.geolocation.clearWatch()清除說有watchPosition。

地址轉換：

由於地理位置API返回的是經緯度，如果要計算兩個位置之間的距離，可以使用著名的Haversine公式計算兩個坐標在地平線上的距離。

Listing 4-7. A JavaScript Haversine implementation

 

JavaScript Code復制內容到剪貼板

1. function toRadians(degree) {    
2.       return degree * Math.PI / 180;    
3.     }     
4.     
5.     function distance(latitude1, longitude1, latitude2, longitude2) {    
6.       // R is the radius of the earth in kilometers    
7. var R = 6371;      
8.     
9.       var deltaLatitude = toRadians(latitude2-latitude1);    
10. var deltaLongitude = toRadians(longitude2-longitude1);    
11.       latitude1 =toRadians(latitude1);    
12.  latitude2 =toRadians(latitude2);     
13.     
14. var a = Math.sin(deltaLatitude/2) *    
15. Math.sin(deltaLatitude/2) +    
16.               Math.cos(latitude1) *    
17.               Math.cos(latitude2) *    
18. Math.sin(deltaLongitude/2) *    
19. Math.sin(deltaLongitude/2);     
20.     
21.       var c = 2 * Math.atan2(Math.sqrt(a),    
22. Math.sqrt(1-a));    
23.       var d = R * c;    
24.       return d;    
25. }