HTML5 – 地理定位

HTML5 地理定位 API 允许你与自己喜爱的网站分享你的位置。JavaScript 可以捕获你的纬度和经度，并可以发送到后端服务器，做像查找当地商家或在地图上显示你的位置等有趣的位置感知功能。

如今，大多数浏览器和移动设备都支持地理定位 API。地理位置 API 与一个全局导航器对象的新属性，即地理位置对象（Geolocation object），一起运作。可通过以下代码创建地理位置对象 −

var geolocation = navigator.geolocation;

地理位置对象是一个服务对象，允许插件检索设备的地理位置信息。

地理定位方法

地理位置对象提供以下方法 −

示例

以下是使用上述任何方法的样本代码 −

function getLocation() {
   var geolocation = navigator.geolocation;
   geolocation.getCurrentPosition(showLocation, errorHandler);
}

这里，showLocation 和 errorHandler 是回调方法，将在下一节中被用来获取实际位置和处理任何错误。

地址属性

地理位置方法 getCurrentPosition() 和 getPositionUsingMethodName() 指定了检索位置信息的回调方法。这些方法通过一个存储完整位置信息的对象 Position 异步调用。

Position 对象指定了设备当前的地理位置。位置表示为一组地理坐标及有关方向和速度的信息。

下表描述了 Position 对象的属性。对于可选属性，如果系统无法提供值，则该属性的值设置为 null。

示例

以下是使用Position对象的示例代码。showLocation方法是一个回调方法。

function showLocation( position ) {
   var latitude = position.coords.latitude;
   var longitude = position.coords.longitude;
   ...
}

处理错误

地理定位很复杂，非常需要捕捉任何错误并优雅地处理它们。

geolocations方法getCurrentPosition（）和watchPosition（）使用错误处理程序回调方法，该方法返回PositionError对象。此对象具有以下两个属性：

以下表格描述了PositionError对象中可能返回的可能错误代码。

示例

以下是使用PositionError对象的示例代码。errorHandler方法是一个回调方法。

function errorHandler( err ) {

   if (err.code == 1) {

      // access is denied
   }
   ...
}

位置选项

以下是getCurrentPosition（）方法的实际语法 –

getCurrentPosition(callback, ErrorCallback, options)

这里的第三个参数是 PositionOptions 对象，该对象指定了用于检索设备地理位置的一组选项。

以下是可以指定为第三个参数的选项 −

例子

以下是一个示例代码，显示如何使用上述方法 −

function getLocation() {
   var geolocation = navigator.geolocation;
   geolocation.getCurrentPosition(showLocation, errorHandler, {maximumAge: 75000});
}