Chinaunix首页 | 论坛 | 博客
  • 博客访问: 32700
  • 博文数量: 8
  • 博客积分: 171
  • 博客等级: 入伍新兵
  • 技术积分: 105
  • 用 户 组: 普通用户
  • 注册时间: 2011-12-26 00:21
文章分类

全部博文(8)

文章存档

2012年(1)

2011年(7)

我的朋友

分类: 系统运维

2011-12-27 00:02:11

使用HTML 5来获得地理位置信息是非常容易的。它可以依赖你的IP地址,设备上有的GPS装置等方法取得你当前的地理位置信息。与手机一样,取得用户当前的地理位置信息需要通过用户的许可,以浏览器为例,它会在工具栏弹出一个提示,询问用户是否容许该网站使用当前的地理位置信息。

在确认浏览器支持HTML 5的地理信息之后,可以使用navigator.geolocation.getCurrentPosition()来取得当前的位置信息。navigator.geolocation.getCurrentPosition()支持两个回调方法,一个用来处理正确的地理位置请求,一个用来进行错误处理。比如通过如下页面可以取得当前所在位置的经度和纬度,并正确的处理失败信息。

getCurrentPosition支持三个查询选项:
enableHighAccuracy - 是否用高精度进行定位(使用高精度,则会使调用更慢)
timeout - 查询超时设定(以毫秒为单位)
maximumAge - 用来设定地理位置失效重查时间,以便进行实时位置跟踪

得到用户的地理位置之后就可以调用各种API完成不同的服务了,比如加载地图、基于地理位置的推荐,等等。

一个工作的示例页面(要注意的是chrome在本地无法执行地理位置请求,需要将相应页面部署在web服务器下方可开始使用地理位置服务。firefox没有该要求):

  1. <html>
  2. <head>
  3. <title>Geo location</title>
  4. </head>

  5. <body>
  6. <p>
  7. <script language="Javascript">
  8. function show_map(position)
  9. {
  10.         document.write("Latitude: "+position.coords.latitude);
  11.         document.write("
    "
    );
  12.         document.write("Longitude: "+position.coords.longitude);
  13. }

  14. function handle_error(err) {
  15.     switch(err.code) {
  16.         case 1:
  17.             document.write("用户不让用地理位置信息");
  18.             break;
  19.         case 2:
  20.             document.write("查询失败,当前可能无网络");
  21.             break;
  22.         case 3:
  23.             document.write("查询超时");
  24.             break;
  25.         default:
  26.             document.write("未知原因查询失败");
  27.             break;
  28.     }
  29. }

  30. navigator.geolocation.getCurrentPosition(show_map);

  31. </script>
  32. </p>
  33. </body>

  34. </html>

阅读(1358) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~