Geolocation地理定位

　　严格来说，Geolocation API并不属于HTML5标准规范，但其API接口使得它能让浏览器或者移动设备的浏览器获取用户的当前位置信息。

 

　　Geolocation API 是通过window.navigator.geolocation获得对地理位置定位的访问的。该对象有如下三个方法：

  • getCurrentPosition()
  • watchPosition()
  • clearWatch()

　　1 首次获取当前位置

　　　　getCurrentPosition方法可以传递三个参数，如下所示：

　　　　　

1 void getCurrentPostion(in PositionCallback successCallback,in optional PositionErrorCallback error Callback,in optional PositionOptions options);

　　第一个参数是必选参数，其作用为获取地理位置信息成功后返回执行的回调函数；

　　第二个参数为获取地理位置信息异常或失败时执行的回调函数，它是可选参数；

　　第三个参数是可选参数，它主要是一些可选属性参数设置。

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset='utf-8'>
 5 <title>Geolocation API 地理定位</title>
 6 <script type-"text/javascript">
 7   navigator.geolocation.getCurrentPosition(function(pos){
 8      console.log("当前地理位置的纬度："+pos.coords.latitude);
 9      console.log("当前地理位置的经度："+pos.coords.longitude);
10      console.log("当前经纬度的精度："+pos.coords.accuracy);
11 });
12 
13 </script>
14 </head>
15 <body>
16 </body>
17 </html>

         pos对象包含有一个coords属性，coords属性表示一系列的地理坐标信息。

  • latitude：以十进制数表示的纬度
  • longitude：以十进制数表示的经度
  • altitude：位置相对于椭圆球面的高度
  • accuracy：以米为单位的经度和纬度坐标的精度水平
  • altitudeAccuracy：以米为单位的高度坐标精度水平
  • heading：运动的方向，通过相对正北做顺时针旋转的角度指定。
  • speed:以米/秒为单位的设备当前地面速度。

 

　　pos对象除了包含一个coords属性外，还包含一个timestamp属性，该属性用于返回coords对象时以毫秒为单位创建时间戳。

　　

　　getCurrentPosition方法的第三个参数的属性有：

 　　　　　　enableHighAccuracy:指定浏览器或移动设备尝试更精确地读取经度和纬度，默认值为false。

　　　　　　timeout：告诉geolocation允许以毫秒为单位的最大时间间隔。

　　　　　　maximunAge:当该缓存的位置信息的时间不大于此参数设定值时，应用程序将接受一个缓存的位置信息。单位是毫秒。

 　　2 监视移动设备的位置变化

　　　　　　watchPosition和clearWatch是一对方法，其原理和setInterval，setTimeout方法相同。watchPosition方法会返回一个唯一标识，clearWatch可通过这个唯一标识清除watchPosition方法的监听。

　　　　　　watchPosition的语法和getCurrentPosition相同，可以传入三个参数，分别是

  • 第一个参数是监听成功后返回的函数；
  • 第二个参数是监听失败后返回的函数；
  • 第三个参数是可选参数。
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charser="utf-8">
 5 <title>Geolocation API 地理定位</title>
 6 
 7 <script type="text/javascript">
 8     navigator.geolocation.getCurrentPosition(function(pos){
 9                 console.log("当前地理位置的维度："+pos.coords.latitude);
10                 console.log("当前地理位置的经度："+pos.coords.longitude);
11                 console.log("当前经纬度的精度："+pos.coords.accuracy);
12 
13 });        
14 var watchID = navigator.geolocation.watchPosition(function(pos){
15               console.log("当前位置变化的纬度："+pos.coords.latitude);
16              console.log("当前位置变化的经度："+pos.coords.longtitude);
17             console.log("当前位置变化经纬度的精度："+pos.coords.accuracy);
18 navigator.geolocation.clearWatch(watchID);
19 },function(){
20 
21 });
22 
23     </script>
24 
25 </head>
26 <body>
27 </body>
28 </html>

 

posted @ 2013-03-18 22:09  94julia  阅读(389)  评论(0)  编辑  收藏  举报