H5-geolocation學習

時間 2019-11-30

標籤 h5 geolocation 學習简体版

原文原文鏈接

geolocation——定位
  PC——IP地址
    精度比較低
    IP庫
      Chrome -> Google
  手機——GPS

  window.navigator.geolocation
    單次    getCurrentPosition(成功, 失敗, 參數)
      enableHighAccuracy      高精度模式——更慢、更費電
      timeout                 超時
      maximumAge              緩存時間

      結果：
        latitude/longitude    緯度/經度
        altitude              海拔高度

        accuracy              精確度
        altitudeAccuracy      高度精確度
        heading               朝向
        speed                 速度
    監聽    watchPosition(成功, 失敗, 參數)

　demo；javascript

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script type="text/javascript">
    window.onload=function (){
      let oBtn=document.getElementById('btn1');

      oBtn.onclick=function (){
        if(window.navigator.geolocation){
          navigator.geolocation.getCurrentPosition(res=>{
            alert('成功');
          }, err=>{
            alert('失敗');
          }, {
            /*
            enableHighAccuracy          //高精度模式
            timeout                     //超時時間
            maximumAge                  //緩存
            */
          });
        }else{
          alert('你的瀏覽器不支持定位');
        }
      };
    };
    </script>
    <title></title>
  </head>
  <body>
    <input type="button" name="" value="定位" id="btn1">
  </body>
</html>

相關標籤/搜索