HTML5地理位置定位API接口开发.ppt
内容摘要,地理位置定位原理与介绍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,纬度,经度,国家,省份,城市,accuracy 准确角altitude 海拔高度altitudeAcuracy 海拔高度的精确度heading 行进方向speed 地面的速度,(第27讲)HTML5 地理位置定位 API 接口开发,HTML5中地理位置定位的方法,navigator.geolocation.getCurrentPosition(,function(error)switch(error.code)caseerror.TIMEOUT:alert(连接超时,请重试);break;caseerror.PERMISSION_DENIED:alert(您拒绝了使用位置共享服务,查询已取消);break;caseerror.POSITION_UNAVAILABLE:alert(,抱歉,暂时无法为您所在的星球提供位置服务);break;);,省略第一个参数,(第27讲)HTML5 地理位置定位 API 接口开发,HTML5中地理位置定位的方法,navigator.geolocation.getCurrentPosition(,option);option配置项,第三个参数是一个对象,该对象影响了获取位置时的一些细节。enableHighAccuracy,它将告诉浏览器是否启用高精度设备,所谓的高精度设备包含但不局限于前面所提到的 GPS 和 WIFI,值为 true 的时候,浏览器会尝试启用这些设备,默认指为 true。timeout,超时,获取位置信息时超出设定的这个时长,将会触发错误,捕获错误的函数将被调用,并且错误码指向TIMEOUT。这样我们尝试修改调用 getCurrentPosition 时传递的参数,省略第一个,第二个参数,(第27讲)HTML5 地理位置定位 API 接口开发,HTML5中地理位置定位的方法,watchPosition像一个追踪器与clearWatch成对。watchPosition与clearWatch有点像setInterval和clearInterval的工作方式。var watchPositionId=navigator.geolocation.watchPosition(success_callback,error_callback,options);navigator.geolocation.clearWatch(watchPositionId);,只针对移动设备,(第27讲)HTML5 地理位置定位 API 接口开发,HTML5+百度地图|地理定位,感谢收看本次教程欢迎访问:,(第27讲)HTML5 地理位置定位 API 接口开发,