HTML5地理定位，百度地图API，知识点熟悉

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTML5地理定位，百度地图API，知识点熟悉相关的知识，希望对你有一定的参考价值。

推断浏览器的兼容问题：
IE9+支持地理定位，FF Chrome新版支持地理定位
 if (navigator.geolocation) {
       alert(‘支持地理定位‘);
  } else {
        alert(‘不支持地理定位‘);
 }

获取自己位置经纬度
<script>
          var x=document.getElementById("wrap");
          function getLocation () {
               if (navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(showPosition);
               } else {
                    alert(‘不支持地理定位——html5自由者！‘);
               }
          } getLocation();

          function showPosition(position) {
               x.innerHTML ="纬度："+position.coords.latitude + "<br />经度："+position.coords.longitude;

          }
     </script>

处理错误和拒绝
getCurrentPosition(參数1，參数2); 方法的第二个參数用于处理错误。它规定当获取用户位置失败时执行的函数

错误代码：

  • Permission denied - 用户不同意地理定位
  • Position unavailable - 无法获取当前位置
  • Timeout - 操作超时

/*显示定位错误*/
          function showError(error) {
               switch(error.code) {
                    case error.POSITION_UNAVAILABLE:
                         x.innerHTML="无法获取当前位置！

"; break;
                    case error.PERMISSION_DENIED:
                         x.innerHTML="用户不同意地理定位！

"; break;
                    case error.TIMEOUT:
                         x.innerHTML="操作超时！"; break;
                    case error.UNKNOWN_ERROR:
                         x.innerHTML="未知的错误！" ; break;
               }
          }

技术分享
watchPosition 用法跟getCurrenPosition方法类似 。watchPosition返回用户的当前位置，假设用户移动则返回实时位置，就跟GPS一样。

① navigator.geolocation.watchPosition(showPosition);

② clearWatch() - 停止 watchPosition() 方法


? 百度地图API助手   http://developer.baidu.com/map/

 /*经纬度显示在地图上*/
     function showOnMap(position){
        var latlon=position.coords.latitude+","+position.coords.longitude;
        var img_url="http://maps.googleapis.com/maps/api/staticmap?

center="

       +latlon+"&zoom=14&size=400x300&sensor=false";
       document.getElementById("mapholder").innerHTML="<img src=‘"+img_url+"‘ />";
      }












































以上是关于HTML5地理定位，百度地图API，知识点熟悉的主要内容，如果未能解决你的问题，请参考以下文章

学习总结HTML5- 03 地理定位

JS 百度地图导航

谷歌地图api中的Html5地理位置[重复]

百度地图开发介绍

关于百度地图API的地图坐标转换问题

怎么用百度地图api自动获取当前位置（谷歌的也行）