[WebGIS] HTML5跟踪GPS轨迹（1）关于HTML5中的定位函数

在前文《HTML5跟踪GPS轨迹（0）应用开发及简介》中介绍了使用HTML5跟踪GPS轨迹的思路，本文就介绍下笔者收集的关于HTML5中定位相关的函数。PS：最近有一点忙，就没更新，抱歉。

在HTML5中定位相关的API是由navigator.geolocation对象提供的，在浏览的Console中输入navigator.geolocation,可以查看这个对象的具体内容。

可见navigator.geolocation对象包含三个函数：getCurrentPosition， watchPosition， clearWatch，具体介绍如下。

getCurrentPosition

这个函数之前有过介绍：《html5接口getCurrentPosition函数详解》，因为这次探索有了新收获，这里再重新介绍一次（别嫌我啰嗦）。

函数原型

getCurrentPosition(successCallback,errorCallback,positionOptions)

参数：

1. successCallback 表示定位成功的回调函数。
2. errorCallback 表示定位失败的回调函数。
3. positionOptions 函数参数。

其中定位成功和失败的回调的函数都会带有一个参数，用于记录成功或者失败的信息，最后一个参数用于设置定位的相关参数。

下面是一个调用示例：

function updateLocation(position) { 
  var latitude = position.coords.latitude; 
  var longitude = position.coords.longitude; 
  var accuracy = position.coords.accuracy; 

  document.getElementById(“纬度”).innerHTML = latitude; 
  document.getElementById(“经度”).innerHTML = longitude; 
  document.getElementById(“准确度”).innerHTML = accuracy + “米”; 
}

function handleLocationError(error) { 
  switch (error.code) { 
  case 0: 
    updateStatus(“尝试获取您的位置信息时发生错误：” + error.message); 
    break; 
  case 1: 
    updateStatus(“用户拒绝了获取位置信息请求。”); 
    break; 
  case 2: 
    updateStatus(“浏览器无法获取您的位置信息。”); 
    break; 
  case 3: 
    updateStatus(“获取您位置信息超时。”); 
    break; 
  } 
}

var myOptions = {
  enableHighAccuracy: true,
  timeout: 30000,
  maximumAge: 0
};

navigator.geolocation.getCurrentPosition(updateLocation, handleLocationError, myOptions);

定位成功的回调函数参数中包含时间和定位信息：coords 和 timestamp。其中 coords 属性包含以下7个值：

• accuracy：精确度
• latitude：纬度
• longitude：经度
• altitude：海拔
• altitudeAcuracy：海拔高度的精确度
• heading：朝向
• speed：速度

PS:根据笔者的实际测试，并不是所有的数据都能获取的到，不同浏览器的获取到的参数也不相同。但是经纬度和精确度这三个是都可以获取到的。

定位失败的回调函数参数中包含错误信息和代码两个属性：

• message：错误信息
• code：错误代码。

其中错误代码包括以下四个值：

• UNKNOW_ERROR：表示不包括在其它错误代码中的错误，这里可以在 message 中查找错误信息
• PERMISSION_DENIED：表示用户拒绝浏览器获取位置信息的请求
• POSITION_UNAVALIABLE：表示网络不可用或者连接不到卫星
• TIMEOUT：表示获取超时。必须在options中指定了timeout值时才有可能发生这种错误

最后的option参数是一个对象，包含3个设置选项：

• enableHighAcuracy — 布尔值： 表示是否启用高精确度模式，如果启用这种模式，浏览器在获取位置信息时可能需要耗费更多的时间。
• timeout — 整数： 表示浏览需要在指定的时间内获取位置信息，否则触发errorCallback，单位为 ms。默认值为 Infinity，即无穷大（无限制）。
• maximumAge — 整数/常量： 表示浏览器重新获取位置信息的时间间隔，单位为 ms，默认为0.

经过笔者的设置，enableHighAccuracy最好开启，要不在Android上会很不准；timeout 是超时时间，为了使你的程序可用一定要设置一个超时；maximumAge 是重新定位的时间间隔，这个参数有点绕？这里打个比方，比如你设置了5000ms（也是5秒），你在第一次获取了一个位置，当第2秒（小于5秒）后再获取位置的时候，为了节省资源，会直接使用第一次的结果，也就是相当于一个定位的缓存。默认值为0，也就是说每次调用都会重新获取当前位置。

watchPosition

函数原型

watchPosition(successCallback,errorCallback,positionOptions)

这个函数的功能从字面也应该可以看的出来，也就是持续定位位置。在很多移动的场景中（比如走路）一次定位是没有意义的，持续的位置信息才能记录下运动的轨迹。而这个函数也就是为此设计的，它的参数和上面的getCurrentPosition是一样一样的。不同的是调用的这个函数会返回一个watchid，同时这个函数持续返回位置信息，也就是说会不断的调用callback。

clearWatch

函数原型

clearWatch(watchId);

这个函数是和上面的watchPosition是成对的，作用就是停止watchPosition函数，其实这对函数和JS中的setInterval的很像。其中watchid就是上面watchPosition函数所返回的ID。

结语

综上，有个这三个函数，使用HTML5获取到经纬度信息已经不成问题了。