分享好友 最新动态首页 最新动态分类 切换频道
移动web手机开发--定位手机开发「移动web手机开发--定位」
2025-02-16 20:52

最近开发过程中,遇到了需求,要求能查询出手机当前的位置,由于不是正式的app形式,只能通过html5的地理定位方法去获取。

navigator.geolocation的三个方法

1. getCurrentPosition()

2. watchPosition()

3. clearWatch()

getCurrentPosition()

使用方法:navigator.geolocation.getCurrentPosition(successCallback, [errorCallback] , [positionOptions]);

A) successCallback 获取定位成功时执行的回调函数 eg: function(position){alert("纬度"+position.coords.latitude+";经度"+position.coords.longitude)};

successCallback返回一个地理数据对象position作为参数,该对象有属性

 使用之前要先检查浏览器是否支持

   <script type="text/javascript">  
        if(navigator.geolocation){  
            navigator.geolocation.getCurrentPosition(getPositionSuccess, getPositionError);  
        }else{  
            alert("您的浏览器不支持Geolocation!");  
        }  
    </script> 

以及调用成功和失败的回调函数

<script type="text/javascript">  
function getPositionSuccess(position){  
    var lat = position.coords.latitude;  
    var lng = position.coords.longitude;  
    document.write("所在位置: 经度(" + lat + "),纬度(" + lng + ")");  
    if(typeof position.address !== "undefined"){  
        var country = position.address.country;  
        var province = position.address.region;  
        var city = position.address.city;  
        document.write("<br />");  
        document.write("您位于" + country + province + city);  
    }  
}  
function getPositionError(error){  
    switch(error.code){  
        case error.TIMEOUT:  
            alert("连接超时,请重试");  
            break;  
        case error.PERMISSION_DENIED:  
            alert("您拒绝了使用位置共享服务,查询已取消");  
            break;  
        case error.POSITION_UNAVAILABLE:  
            alert("非常抱歉,我们暂时无法为您所在的星球提供位置服务");  
            break;  
    }  
}  
</script> 

B) errorCallback 定位失败时执行的回调函数 eg: function(error){alert(error.message);}

errorCallback返回一个错误数据对象error作为参数,该对象有属性

  1.code :表示失败原因,返回1 or 2 or 3 ,具体为

     (数值为1) 表示没有权限使用地理定位API

    POSITION_UNAVAILABLE (数值为2) 表示无法确定设备的位置,例如一个或多个的用于定位采集程序报告了一个内部错误导致了全部过程的失败

    TIMEOUT (数值为3) 表示超时

    详情查看 http://dev.w3.org/geo/api/spec-source.html#permission_denied_error

  2.message :错误提示内容 

C) positionOptions 用来设置positionOptions来更精细的执行定位,positionOptions拥有三个属性{enableHighAccuracy:boolean , timeout:long , maximumAge:long}。

enableHighAccuracy 【true or false(默认)】是否返回更详细更准确的结构,默认为false不启用,选择true则启用,但是会导致较长的响应时间及增加功耗,这种情况更多的用在移动设备上。

timeout 设备位置获取操作的超时时间设定(不包括获取用户权限时间,单位为毫秒,如果在设定的timeout时间内未能获取位置定位,则会执行errorCallback()返回code(3)。如果未设定timeout,那么timeout默认为无穷大,如果timeout为负数,则默认timeout为0。

maximumAge 设定位置缓存时间,以毫秒为单位,如果不设置该值,该值默认为0,如果设定负数,则默认为0。该值为0时,位置定位时会重新获取一个新的位置对象;该值大于0时,即从上一次获取位置时开始,缓存位置对象,如果再次获取位置时间不超过maximumAge,则返回缓存中的位置,如果超出maximumAge,则重新获取一个新的位置。

watchPosition()

功能getCurrentPosition()相似,watchPosition()是定期轮询设备的位置,同样拥有3个参数,与getCurrentPosition()相同。

使用方法:navigator.geolocation.watchPosition(successCallback, [errorCallback] , [positionOptions]);

执行步骤

1.首先初始化positionOptions内的属性(详细同上)。

2.判断是否有缓存位置对象,该对象年龄是否可用、是否超出maximumAge ,如果可用且未超出,返回缓存位置,否则重新确定设备位置。

3.位置定位操作

  i.建立一个计时器,进行位置获取操作,如果在timeout之前完成,执行下一步;如果未在timeout之前完成,则执行errorCallback(),code为3,跳出步骤做等待重新激活。

  ii.如果在timeout之前获得位置成功,则执行successCallback(),然后重置计时器(从获取位置成功时刻重新算起,继续挂起获取新位置。当有与之前位置有明显不同位置出现时,再次执行successCallback(),并重复操作,该循环直到timeout超时或者获取操作中遇到POSITION_UNAVAILABLE错误执行errorCallback()为止,亦或者执行clearWatch()操作。

clearWatch()

配合watchPosition()使用,用于停止watchPosition()轮询。

watchPosition()需要定义一个watchID,var watchID = watchPosition(...),通过clearWatch(watchID)来停止watchPosition(),使用方法类似setInterval。

最新文章
华为手机怎么设置一直震动手机一直震动不停怎么回事「华为手机怎么设置一直震动」
参考内容一:1、在手机主屏幕上点击【设置】。2、点击【声音】。3、打开【静音】和【静音时振动】右侧的开关。参考内容二:1. 点击声音首先打开设置,点击声音进入。2. 关闭静音进入界面,点击关闭静音时振动。3. 关闭振动或者在控制中心界
以旧换新政策下 “退休”的手机该如何处置手机以旧换新有风险吗「以旧换新政策下 “退休”的手机该如何处置」
新重庆-重庆日报消息,在刚刚过去的2024年,受以旧换新政策带动,中国家电消费火热。新年伊始,手机市场也感受到了来自政策的春风——1月16日,在商务部举行的专题新闻发布会上,有关负责人表示,全国各地将从1月20日开始陆续实施手机等数
X浏览器安卓最新版x浏览器手机版「X浏览器安卓最新版」
X浏览器安卓最新版是一个双核的搜索浏览器,可以帮助大家上网冲浪,搜索任何想要的东西,例如、图片、文档、小说、影视等等。支持多个搜索引擎,还有海量的网站和资讯,综合性很高。双核心一键切换打开“X浏览器”后,可以看到它的操作界面
猎豹免费wifi 校园神器 v5.1.17110916 官方安装版猎豹免费wifi手机版「猎豹免费wifi 校园神器 v5.1.17110916 官方安装版」
众所周知校园网的网络是有限制的,基本上都是无法开启wifi共享,不过现在不一样了,猎豹免费wifi校园神器发布了,它在已限制了WiFi共享功能的校园网客户端方面做了进一步的支持,让更多的学子能用上免费WiFi!不仅仅是简单地能用上免费WiFi
小米两款新车细节曝光:价格预计12-15万起、有增程vivo新款手机即将上市「小米两款新车细节曝光:价格预计12-15万起、有增程」
据国内媒体报道,小米计划在2025年上半年推出其第二款新车,这是一款纯电SUV。该车延续了小米首款车的设计水准,并采用溜背式轿跑SUV设计,车顶线条流畅,延伸至车尾,呈现出一种动感十足的姿态。关于小米的新车,有机构的报告显示,小米未
GPS海拔高度测量仪手机版 v2.1.8手机测量仪「GPS海拔高度测量仪手机版 v2.1.8」
GPS海拔高度测量仪手机版是一款免费的手机GPS工具箱,用户可以在这里进行GPS精准定位、海拔的测量、地震预警等功能,是一款简单好用功能强大的GPS测量服务软件,里面的功能都是免费提供给用户的,支持全球旅行记录打卡,感兴趣的用户快来下
生化危机4重置版mod生化危机4手机版「生化危机4重置版mod」
生化危机4重置版mod是一款大型的末日生存类手游,非常的受欢迎有着超多的系列版本,这边小编带来的是生化危机4,重置版mod玩家此次的任务就是拯救总统的女儿,要注意随时出现的危险哦,喜欢的玩家们还等什么,快来点击下载吧!生化危机4重
45岁周杰伦瘦身成功,重回颜值巅峰,昆凌陪婆婆看周董演唱会周杰伦手机「45岁周杰伦瘦身成功,重回颜值巅峰,昆凌陪婆婆看周董演唱会」
更让人羡慕的是,昆凌也陪着婆婆一起来看周董的演唱会了。昆凌啊,那可是模特出身,颜值身材都是一流的,站在那儿就是一道风景线。她看着周杰伦的眼神,那叫一个欣赏,那叫一个甜蜜,简直要溢出屏幕了!而周董的妈妈呢,也是打扮得时尚又得
小辣椒x12pro参数配置-小辣椒x12pro参数详情小辣椒手机参数「小辣椒x12pro参数配置-小辣椒x12pro参数详情」
小辣椒x12pro这款手机可是一款为老年人服务的手机,小伙伴们一定是想要知道这款手机有着什么样子的性能是否适合家中长辈,现在就有小编来为大家介绍一下这款手机吧。手机型号小辣椒x12pro?手机外形手机屏幕6.5英寸TFT+1920X1080像素手
华为X5当主力机使用了一个月,已经开始卡了,前后亏了4000,出了,还是换15PM吧华为手机x5「华为X5当主力机使用了一个月,已经开始卡了,前后亏了4000,出了,还是换15PM吧」
华为X5刚出的时候,我最开始就加价好几千买了一台,后面发现通过升级电信套餐,可以原价买到华为mate X5,于是又这样操作买了两台。买这个手机的主要目的就是送礼,因为送礼的目标用户都是属于中年人。本来以为他们会很喜欢使用X5,结果其
相关文章
推荐文章
发表评论
0评