使用getCurrentPosition方法实时获取当前Geolocation信息:
1、getCurrentPosition方法的使用
1 navigator.geolocation.getCurrentPosition(
2 function (position) {
3 //获取地理位置成功时所做的处理
4 },
5 function (error) {
6 //获取地理位置信息失败时所做的处理
7 }, //以下是可选属性
8 {
9 enableHighAccuracy: true,//是否要求高精度的地理位置信息
10 timeout: 1000,//对地理位置信息的获取操作做超时限制，如果再该事件内未获取到地理位置信息，将返回错误
11 maximumAge:60*1000//设置缓存有效时间，在该时间段内，获取的地理位置信息还是设置此时间段之前的那次获得的信息，超过这段时间缓存的位置信息会被废弃
12 })
2、使用getCurrentPosition方法和position对象的一些属性等实现实时获取地理位置的经纬度
1 <!Doctype html>
2 <html>
3 <head>
4 <title></title>
5 <meta charset="utf-8" />
6 <meta name="keywords" content="关键词"/>
7 <meta name="description" content="描述"/>
8 <meta name="author" content="奇客艺术"/>
9 </head>
10 <body>
11 <p id="GeoDisplay"></p>
12 <script>
13 Geolocation();//执行Geolocation()函数
14 setInterval(Geolocation,100);//设置定时器，100ms执行一次Geolocation();实现实时获取
15 function getElem(id) {
16 return typeof id === 'string' ? document.getElementById(id):id;//typeof表示变量id的类型为字符串类型
17 }
18 var GetID = getElem("GeoDisplay");
19 function showMap(lat,lon) {//自定义了一个在浏览器上显示地理信息的函数
20 var str = "您当前位置的维度："+lat+"，经度："+lon;
21 GetID.innerHTML = str;
22 }
23 function Geolocation() {
24 if(navigator.geolocation){
25 navigator.geolocation.getCurrentPosition(
26 function (position) {//传入了对象position
27 showMap(position.coords.latitude,position.coords.longitude);
28 },
29 function (err) {//传入了error对象
30 GetID.innerHTML = err.code + '\n'+err.message;//Firefox3.6以上不支持error对象的message属性
31 //error对象的code属性有如下属性值:
32 //PERMISSION_DENIED(1):(permission_denied):用户单机信息条上的“不共享”按钮或直接拒绝被获取位置信息
33 //POSITION_UNAVAILABLE(2):(position_unavailable):(position_unavailable)网络不可用或者无法连接到获取位置信息的卫星
34 //TIMEOUT(3):(timeout)网络可用但在计算机用户的位置上花费过长时间
35 //UNKNOWN_ERROR(0):(unknown_error)发生其他未知错误
36 })
37 }else {
38 GetID.innerHTML = "您当前使用的浏览器不支持地理定位服务";
39 }
40 }
41 </script>
42 </body>
43 </html>
Effect Picture:(当然也会受到网络的影响，变化没那么快；Microsoft Edge 38.14393.0.0下测试)
文章系笔者原创，转载请注明出处，感谢合作！
