首页课程HTML趣味课堂HTML5 地理定位

HTML5 地理定位

目录列表

什么是 Geolocation API?

HTML5 Geolocation API 用于获得用户的地理位置。

鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。

注意:Geolocation(地理定位)对于拥有 GPS 的设备,比如 iPhone,地理定位更加精确。


HTML5 Geolocation API 用于获得什么?

使用地理定位

Geolocation API 的主要方法是 getCurrentPosition,它用来获得用户的位置。

下面是一个简单的地理定位实例,可返回用户位置的经度和纬度:

var x=document.getElementById("demo");
function getLocation(){
  if (navigator.geolocation){
    navigator.geolocation.getCurrentPosition(showPosition);
  }
  else{
    x.innerHTML="该浏览器不支持获取地理位置。";
  }
}
function showPosition(position){
  x.innerHTML="纬度: " + position.coords.latitude + 
  "<br>经度: " + position.coords.longitude;    
}


实例解析:

  • 检测是否支持地理定位。

  • 如果支持,则运行 getCurrentPosition() 方法。如果不支持,则向用户显示一段消息。

  • 如果 getCurrentPosition() 运行成功,则向参数 showPosition 中规定的函数返回一个 coordinates 对象。

  • showPosition() 函数获得并显示经度和纬度。

上面的例子是一个非常基础的地理定位脚本,不含错误处理。

你需要先熟悉基本的 JavaScript 才能理解和使用 API。



HTML5 中 Geolocation API 主要用的是?

getCurrentPosition() 方法返回数据

如果 getCurrentPosition() 运行成功,则 getCurrentPosition() 方法返回对象。始终会返回 latitude、longitude 以及 accuracy 属性。如果可用,则会返回其他下面的属性:

  • coords.latitude:十进制数的纬度

  • coords.longitude:十进制数的经度

  • coords.accuracy:位置精度

  • coords.altitude:海拔,海平面以上以米计

  • coords.altitudeAccuracy:位置的海拔精度

  • coords.heading:方向,从正北开始以度计

  • coords.speed:速度,以米/每秒计

  • timestamp:响应的日期/时间


getCurrentPosition() 方法成功返回对象,始终会返回哪些属性?

1/6