推断浏览器的兼容问题:

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,知识点熟悉的更多相关文章

  1. Html5——地理定位及地图

    常用的navigator.geolocation对象有以下三种方法: 获取当前地理位置:navigator.geolocation.getCurrentPosition(success_callbac ...

  2. 微信小程序城市定位(百度地图API)

    概述 微信小程序提供一些API(地址)用于获取当前用户的地理位置等信息,但无论是wx.getLocation,还是wx.chooseLocation均没有单独的字段表示国家与城市信息,仅有经纬度信息. ...

  3. html5 geolocation配合百度地图api实现定位

    1.了解html5 geolocation HTML5 Geolocation(地理定位)用于定位用户的位置.鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的.=> 使用时 ...

  4. HTML5 调用百度地图API地理定位

    <!DOCTYPE html> <html> <title>HTML5 HTML5 调用百度地图API地理定位实例</title> <head&g ...

  5. HTML5调用百度地图API进行地理定位实例

    自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图AP ...

  6. html5:地理信息 LBS基于地理的服务和百度地图API的使用

    地理位置请求 单次定位请求getCurrentPosition(请求成功函数,请求失败函数,数据收集方式) 多次定位请求watchPosition(请求成功函数,请求失败函数,数据收集方式) 关闭更新 ...

  7. 百度地图API的IP定位城市和浏览器定位(转)

    百度地图API提供了Geolocation 和 LocalCity两个服务类. 这俩API可以分别供用户在JavaScript中进行定位和城市确认. 1 本质上,Geolocation这个类是使用了支 ...

  8. 如何利用【百度地图API】进行定位?非GPS定位

    原文:如何利用[百度地图API]进行定位?非GPS定位 如果你可以上网,如果你有火狐浏览器,那么恭喜你.你能很容易使用以下代码进行定位! ------------------------------- ...

  9. 使用html5获取当前手机的经纬度,并接入百度地图API,查询出当前位置

    最近项目需要,稍微研究一下html5获取当前地理位置的问题. 获取当前位置的经纬度很简单,一句代码就搞定 navigator.geolocation.getCurrentPosition(functi ...

随机推荐

  1. B/S结构和C/S结构

    概念: C/S结构,即Client/Server(客户机/服务器)结构,是大家熟知的软件系统体系结构,通过将任务合理分配到Client端和Server端,降低了系统的通讯开销,可以充分利用两端硬件环境 ...

  2. SublimeText3常用快捷键和优秀插件(转载)

    SublimeText是前端的一个神器,以其精简和可DIY而让广大fans疯狂.好吧不吹了直入正题 -_-!! 首先是安装,如果你有什么软件管家的话搜一下就好,一键安装.然后,有钱的土豪就自己买个吧, ...

  3. Matlab 之meshgrid, interp, griddata 用法和实例

    http://blog.sina.com.cn/s/blog_67f37e760101bu4e.html 实例结果http://wenku.baidu.com/link?url=SiGsFZIxuS1 ...

  4. 详述USB OTG发展及协议标准

    USB On-The-Go 扩大了USB 的应用领域,将USB 从传统的PC 与外设通讯的模式,扩展到移动电子和嵌入式领域中,抛开主机PC,实现通常的外设与外设之间点对点(Point to Point ...

  5. Office 2010简体中文正式版完美终身破解版免费下载

    名称:Microsoft Office Professional 2010 正式版(JK破解免序列号安装版) Microsoft Office 2010 专业版 优点:用官方Microsoft off ...

  6. EOF 空格问题

    mysql -u $USER -p${PASSWORD} $DATABASE << EOF >/tmp/dd-$$ 2>/tmp/ddd-$$select *from $TAB ...

  7. jQuery的三种$()

    参考脚本之家“http://www.jb51.net/article/21660.htm”   $号是jQuery“类”的一个别称,$()构造了一个jQuery对象.所以,“$()”可以叫做jQuer ...

  8. GWT RPC机制

    GWT RPC GWT RPCRemote Procedure Calls GWT: Google Web Toolkit的缩写,有了 GWT可以使用 Java 编程语言编写 AJAX 前端,然后 G ...

  9. BZOJ 3533: [Sdoi2014]向量集( 线段树 + 三分 )

    答案一定是在凸壳上的(y>0上凸壳, y<0下凸壳). 线段树维护, 至多N次询问, 每次询问影响O(logN)数量级的线段树结点, 每个结点O(logN)暴力建凸壳, 然后O(logN) ...

  10. Hibernate总结(二)---hibernate中的各种映射

    知识的准备: (参考:汤阳光Hibernate3.6(基础)) 一.浅谈javaBean之间的关系 存在的关系: 1.关联(一对一.一对多.多对一.多对多) 2.聚合/组合(最后考虑) 3.继承 所以 ...