• 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+"' />";
          }

  • 相关阅读:
    php使用cookie来保存用户登录信息
    Linux下进程操作
    TortoiseSVN无法编辑日志信息的解决方法
    用DIV布局制作公告板
    HashMap的遍历
    实现文本滚动
    子DIV块中设置margintop时影响父DIV块位置的解决办法
    php使用session来保存用户登录信息
    javascript jquery ajax动态提交多个参数 api测试 拂晓风起
    javascript 处理返回json中的\u中文乱码问题(也不是乱码了,就是\u编码) 拂晓风起
  • 原文地址:https://www.cnblogs.com/mengfanrong/p/5206423.html
Copyright © 2020-2023  润新知