使用getCurrentPosition方法实时获取当前Geolocation信息(附源码文件)--html5、JavaScript
2017-10-22 11:27
846 查看
使用getCurrentPosition方法实时获取当前Geolocation信息:
1、getCurrentPosition方法的使用
navigator.geolocation.getCurrentPosition( function (position) { //获取地理位置成功时所做的处理 }, function (error) { //获取地理位置信息失败时所做的处理 }, //以下是可选属性 { enableHighAccuracy: true,//是否要求高精度的地理位置信息 timeout: 1000,//对地理位置信息的获取操作做超时限制,如果再该事件内未获取到地理位置信息,将返回错误 maximumAge:60*1000//设置缓存有效时间,在该时间段内,获取的地理位置信息还是设置此时间段之前的那次获得的信息,超过这段时间缓存的位置信息会被废弃 })
2、使用getCurrentPosition方法和position对象的一些属性等实现实时获取地理位置的经纬度
<!Doctype html> <html> <head> <title></title> <meta charset="utf-8" /> <meta name="keywords" content="关键词"/> <meta name="description" content="描述"/> <meta name="author" content="奇客艺术"/> </head> <body> <p id="GeoDisplay"></p> <script> Geolocation();//执行Geolocation()函数 setInterval(Geolocation,100);//设置定时器,100ms执行一次Geolocation();实现实时获取 function getElem(id) { return typeof id === 'string' ? document.getElementById(id):id;//typeof表示变量id的类型为字符串类型 } var GetID = getElem("GeoDisplay"); function showMap(lat,lon) {//自定义了一个在浏览器上显示地理信息的函数 var str = "您当前位置的维度:"+lat+",经度:"+lon; GetID.innerHTML = str; } function Geolocation() { if(navigator.geolocation){ navigator.geolocation.getCurrentPosition( function (position) {//传入了对象position showMap(position.coords.latitude,position.coords.longitude); }, function (err) {//传入了error对象 GetID.innerHTML = err.code + '\n'+err.message;//Firefox3.6以上不支持error对象的message属性 //error对象的code属性有如下属性值: //PERMISSION_DENIED(1):(permission_denied):用户单机信息条上的“不共享”按钮或直接拒绝被获取位置信息 //POSITION_UNAVAILABLE(2):(position_unavailable):(position_unavailable)网络不可用或者无法连接到获取位置信息的卫星 //TIMEOUT(3):(timeout)网络可用但在计算机用户的位置上花费过长时间 //UNKNOWN_ERROR(0):(unknown_error)发生其他未知错误 }) }else { GetID.innerHTML = "您当前使用的浏览器不支持地理定位服务"; } } </script> </body> </html>
Effect Picture:(当然也会受到网络的影响,变化没那么快;Microsoft Edge 38.14393.0.0下测试)
源码文件下载:getCurrentPosition方法实时获取当前Geolocation信息.zip
文章系笔者原创,转载请注明出处,感谢合作!
相关文章推荐
- html5 geolocation / 百度地图api Geolocation 定位当前城市信息&window.navigator.geolocation.getCurrentPosition,在IO
- js 获取位置信息方法 navigator.geolocation.getCurrentPosition 失败原因分析
- 如何在mapreduce方法中获取当前使用文件(get file name)
- 如何使用libcurl实现HTTP的GET方法获取文件长度
- HTML5浏览器定位navigator.geolocation.getCurrentPosition
- php中使用getimagesize获取图片、flash等文件的尺寸信息实例
- JavaScript获取当前运行脚本文件所在目录的方法
- php中使用getimagesize获取图片、flash等文件的尺寸信息实例
- 获取Exe文件版本信息的函数(使用GetFileVersionInfo得到TFileVersionInfo结构体,包含12项内容)
- JavaScript获取当前运行脚本文件所在目录的方法
- PHP获取当前文件路径信息的方法
- 如何使用libcurl实现HTTP的GET方法获取文件长度
- Qt学习笔记,使用QDir获取当前目录下所有目录和文件信息
- 使用GetModuleFileName()获取当前.exe所在绝对路径,并且读取.ini配置文件
- DMP文件的生成和使用(转),由于须要取得用户出现问题的信息,所以须要取得demp信息,可以通过本方法获取。
- 获取当前进程文件所在目录,用于替代GetCurrentDirectory
- Javascript中使用A标签获取当前目录的绝对路径方法
- ASP.NET获取IP及电脑名等信息的简单方法+通用类文件源码
- 如何使用libcurl实现HTTP的GET方法获取文件长度
- ASP.NET获取IP及电脑名等信息的简单方法+通用类文件源码 (转载)