当前位置: 首页 > Web前端 > HTML5

HTML5——GeolocationAPI

时间:2023-04-05 14:34:26 HTML5

Geolocation(地理定位)是HTML5的重要特性之一,它提供了确定用户所在位置的功能。利用此功能,可以开发基于位置信息的应用程序。在访问位置信息之前,浏览器会询问用户是否共享他们的位置信息。以Chrome浏览器为例,如果您允许Chrome浏览器与网站共享您的位置,Chrome浏览器会将本地网络信息发送给谷歌定位服务,估计您的位置。浏览器然后与请求它的网站共享您的位置。因为浏览器支持可能不同,所以需要判断当前浏览器是否支持。if(navigator.geolocation){//支持}else{alert('您的浏览器不支持HTML5Geolocation!请更换浏览器~');HTML5导航器对象的Geolocation属性有三种方法。1.getCurrentPositiongetCurrentPosition(success,fail,options)if(navigator.geolocation){//支持navigator.geolocation.getCurrentPosition(function(position)){console.log(position);//position为成功后的位置对象,包括positionInformation//getCurrentPosition执行成功后,getSuccess会传给一个position对象//position有两个属性,coords和timeStamp//timeStamp表示地理数据创建的时间??????//coords是一个包含地理位置数据的对象console.log(position.timestamp);//当前创建时间1529838305986//估计纬度console.log(position.coords.latitude);//39.08737424258291//估计经度console.log(position.coords.coords.accuracy);//324//结果高度的估计精度,以米为单位console.log(position.coords.altitudeAccuracy);//null//主机设备当前的运动方向,以度为单位,相位顺时针计算真北console.log(position.coords.heading);//NAN//设备在地面上的当前速度(以米每秒为单位)console.log(position.coords.speed);//NAN//除了以上结果,Firefox还提供了另外一个属性addressif(position.address){//通过address可以获取国家、省份、城市console.log(position.address.country);console.log(position.address.province);控制台日志(位置。地址。城市);}},locationError,{//指示浏览器获取高精度位置,默认为falseenableHighAcuracy:true,//指定获取地理位置的超时时间,默认无限制,单位为毫秒timeout:5000,//最长有效期,重复获取地理位置时,该参数指定多长时间再次获取位置最大年龄:3000});}else{alert('您的浏览器不支持HTML5地理定位!请更换浏览器~');}//获取失败的回调函数functionlocationError(error){switch(error.code){case1:alert("定位服务被拒绝");休息;case2:alert("暂时无法获取位置信息");休息;case3:alert("获取信息超时");休息;案例4:警报(“未知错误”);休息;}}成功回调在请求成功后返回一个position对象。位置坐标是包含用户位置信息的对象。经度:coords.longitude纬度:coords.latitude精度:coords.accuracy高度:coords.altitude高度精度:coords.altitudeAcuracy行进方向:coords.heading地面速度:coords.speed时间戳:新日期(position.timestamp)如果fail回调请求失败,会返回error对象,error.code为错误状态值。1——Permissiondenied——用户不允许地理定位2——Positionunavailable——无法获取当前位置3——Timeout——操作超时选项是一个参数对象enableHighAcuracy:true,//是否是高精度位置信息requiredtimeout:5000,//允许获取location的最长时间,如果在这段时间内没有获取到则返回错误maximumAge:5000//location可以缓存的最长时间,如果缓冲时间为两次分钟,然后10:00拿一次地址,10:01再拿一次地址,还是上次的地址,因为还没有超过缓冲时间。2、watchCurrentPosition不断获取用户的位置信息。intwatchCurrentPosition(onSuccess,onError,option)该方法返回一个类似于SetInterval的返回值。可以被clearWatch使用。3.clearWatch停止当前watchCurrentPosition。通常我们配合百度、谷歌等API使用。