站長資訊網(wǎng)
最全最豐富的資訊網(wǎng)站

html5 navigator.geolocation基于瀏覽器獲取地理位置代碼案例

一、簡介

html5為window.navigator提供了geolocation屬性,用于獲取基于瀏覽器的當前用戶地理位置。

window.navigator.geolocation提供了3個方法分別是:

void getCurrentPosition(onSuccess,onError,options);  //獲取用戶當前位置    int watchCurrentPosition(onSuccess,onError,options);  //持續(xù)獲取當前用戶位置    void clearWatch(watchId);  //watchId 為watchCurrentPosition返回的值  //取消監(jiān)控      options = {       enableHighAccuracy,//boolean 是否要求高精度的地理信息       timeout,//獲取信息的超時限制       maximumAge//對地理信息進行緩存的時間  }  //options可以不寫,為默認即可

二、position對象

當成功獲取地理位置信息時候,onsuccess方法中會返回position對象,通過這個對象可以獲取地理位置的相關信息,包括:

position對象的屬性:     latitude,//緯度    longitude,//經(jīng)度    altitude,//海拔高度    accuracy,//獲取緯度或者經(jīng)度的精度    altitudeAccurancy,//海拔高度的精度    heading,//設備前景方向。正北方向的順時針旋轉(zhuǎn)角    speed,//設備的前進速度 m/s    timestamp,//獲取地理位置信息時候的時間

三、基于google map的例子

直接看代碼:

<!DOCTYPE HTML>  <html>  <head>      <meta charset="UTF-8">      <title>在頁面上使用google地圖示例</title>  </head>  <body onload = 'init()'>      <div id="map" style='width:800px;height:800px;'></div>      <script type="text/javascript" src='http://maps.google.com/maps/api/js?sensor=false'></script>      <script type="text/javascript">          function init(){              if(navigator.geolocation){                  navigator.geolocation.getCurrentPosition(function(pos){                          var coords = pos.coords;                          var latlng =new google.maps.LatLng(coords.latitude,coords.longitude);                          var options = {zoom:14,center:latlng,mapTypeId : google.maps.MapTypeId.ROADMAP};                          var map1;                          map1 =new google.maps.Map(document.getElementById('map'),options);                          var marker =new google.maps.Marker({                                  position : latlng,                                  map : map1                                  });                          var infowindow =new google.maps.InfoWindow({                                 content : '當前位置!'                                 });                          infowindow.open(map1,marker);                          });              }          }      </script>        </body>  </html>

贊(0)
分享到: 更多 (0)
網(wǎng)站地圖   滬ICP備18035694號-2    滬公網(wǎng)安備31011702889846號
国精品无码一区二区三区在线| 色欲精品国产一区二区三区AV| 国产精品爱啪在线线免费观看| 一级A毛片免费观看久久精品| 78成人精品电影在线播放 | 日韩精品久久久久久免费| 国内精品-bt天堂| 精品人妻va出轨中文字幕| 久久精品免视看国产陈冠希| 国产亚洲美女精品久久久2020| 日韩小视频在线观看| 美女精品永久福利在线| 国产成人精品免费视频网页大全 | 正在播放国产精品放孕妇| 久久国产精品免费视频| 久久精品人人做人人爽电影| 99精品高清视频一区二区| 久久久久国产精品麻豆AR影院| 美女bbbb精品视频| 国产精品区一区二区三| 国产精品videossexohd| 欧美精品久久久久久精品爆乳| 日韩精品无码一本二本三本| 亚洲国产另类久久久精品| 精品亚洲永久免费精品| 国内精品手机在线观看视频| 99热在线日韩精品免费| 久久中文精品无码中文字幕| 久久成人国产精品一区二区| 国产三级精品三级在线观看| 国产精品天干天干在线综合 | 国产精品成人观看视频| 精品一区二区三区无码免费直播| 久热爱精品视频在线| 亚洲国产精品久久久久秋霞小| 99视频精品全部在线播放| 99国产精品99久久久久久| 91精品免费高清在线| 亚洲av永久无码精品三区在线4 | 亚洲国产精品99久久久久久| 亚洲精品无AMM毛片|