第二十八课HTML5地理位置定位API接口开发.ppt

Network Optimization Expert Team 内容摘要 地理位置定位原理与介绍 HTML5中地理位置定位的方法 主讲：张恩民 官网： （第28讲） HTML5 地理位置定位 API 接口开发 （第27讲） HTML5 地理位置定位 API 接口开发 地理位置定位原理与介绍 地理位置定位的几种方式：IP地址，GPS，Wifi，GSM/CDMA 地理位置获取流程： 1、用户打开需要获取地理位置的web应用。 2、应用向浏览器请求地理位置，浏览器弹出询问，询问用户是否共享地理位置。 3、假设用户允许，浏览器从设别查询相关信息。 4、浏览器将相关信息发送到一个信任的位置服务器，服务器返回具体的地理位置。 HTML5地理地位的实现：1. 实现基于浏览器（无需后端支持）获取用户的地理位置技术?2. 精确定位用户的地理位置( 精度最高达10m之内，依赖设备 )?3. 持续追踪用户的地理位置?4. 与 Google Map、或者 Baidu Map 交互呈现位置信息。? （第27讲） HTML5 地理位置定位 API 接口开发 （第27讲） HTML5 地理位置定位 API 接口开发 HTML5中地理位置定位的方法 关于 Geolocation 对象? ?Geolocation API 用于将用户当前地理位置信息共享给信任的站点，这涉及用户的隐私安全问题，所以当一个站点需要获取用户的当前地理位置，浏览器会提示用户是“允许” or “拒绝”。 先看看哪些浏览器支持Geolocation API： IE9.0+、FF3.5+、Safari5.0+、Chrome5.0+、Opera10.6+、IPhone3.0+、Android2.0+ （第27讲） HTML5 地理位置定位 API 接口开发 HTML5中地理位置定位的方法 getCurrentPosition(success,error,option)方法最多可以有三个参数： 第一个参数是成功获取位置信息的回调函数，它是方法唯一必须的参数； 第二个参数用于捕获获取位置信息出错的情况， 第三个参数是配置项。 Geolocation API存在于navigator对象中，只包含3个方法： 1、getCurrentPosition //当前位置 2、watchPosition //监视位置 3、clearWatch //清除监视 （第27讲） HTML5 地理位置定位 API 接口开发 HTML5中地理位置定位的方法 navigator.geolocation.getCurrentPosition( function(p) { var map=维度+p.coords.latitude+经度+p.coords.longitude; alert(var); }); p.address.country p.address. region p.address.city 纬度 经度 国家 省份 城市 accuracy 准确角 altitude 海拔高度 altitudeAcuracy 海拔高度的精确度 heading 行进方向 speed 地面的速度 （第27讲） HTML5 地理位置定位 API 接口开发 HTML5中地理位置定位的方法 navigator.geolocation.getCurrentPosition( … , function(error){ switch(error.code){?? ????????case?error.TIMEOUT?:?? ????????????alert(??连接超时，请重试??);?? ????????????break;?? ????????case?error.PERMISSION_DENIED?:?? ????????????alert(??您拒绝了使用位置共享服务，查询已取消??);?? ????????????break;?? ????????case?error.POSITION_UNAVAILABLE?:??? ????????????alert(??，抱歉，暂时无法为您所在的星球提供位置服务??);?? ????????????break;?? ????}?? }); 省略第一个参数 （第27讲） HTML5 地理位置定位 API 接口开发 HTML5中地理位置定位的方法 navigator.geolocation.getCurrentPosition( … , … , option); option配置项,第三个参数是一个对象，该对象影响了获取位置时的一些细节。 ?enableHigh