使用HTML5进行地理位置定位。误差在+-500m

XML/HTML Code复制内容到剪贴板

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>Geolocation 对象，Geolocation 与 Google Map 交互 ------ JS
  6. Mix</title>
  7. </head>
  8. <body>
  9. <input type="button" id="getPos" value="获取我的位置">
  10. <div id="info" class="">
  11. 您所在的位置： 经度
  12. <span class="tip">unknown</span>，纬度
  13. <span class="tip">unknown</span>
  14. </div>
  15. <script type="text/javascript">
  16. var t = 0;
  17. var dom = {
  18. btn : document.getElementById(‘getPos‘),
  19. info : document.getElementById(‘info‘)
  20. };
  21. dom.btn.onclick = function(){
  22. if (navigator.geolocation) {
  23. dom.info.innerHTML = "请等待查询结果返回";
  24. dom.info.className = "warn";
  25. navigator.geolocation.getCurrentPosition(getPositionSuccess,getPositionError,{timeout:5000});
  26. }else {
  27. dom.info.innerHTML = "抱歉，您所使用的浏览器不支持 Geolocation 接口";
  28. dom.info.className = "warn";
  29. }
  30. }
  31. function getPositionSuccess(position){
  32. var lat = position.coords.latitude;
  33. var lng = position.coords.longitude;
  34. dom.info.innerHTML = "您所在的位置： 经度" + lat + "，纬度" + lng;
  35. if(typeof position.address === "undefined"){
  36. dom.info.innerHTML += "<br /><span class=‘tip‘>您的浏览器目前仅提供坐标查询，使用 Firefox 3.5+ 可获得更多信息</span>";
  37. }else{
  38. dom.info.innerHTML += "<br /><span class=‘tip‘>" + position.address.country + " , " + position.address.region + " , " + position.address.city+"</span>";
  39. }
  40. }
  41. function getPositionError(error){
  42. switch(error.code){
  43. case error.TIMEOUT :
  44. dom.info.innerHTML = "连接超时，请重试";
  45. break;
  46. case error.PERMISSION_DENIED :
  47. dom.info.innerHTML = "您拒绝了使用位置共享服务，查询已取消";
  48. break;
  49. case error.POSITION_UNAVAILABLE :
  50. dom.info.innerHTML = "亲爱的火星网友，非常抱歉<br />我们暂时无法为您所在的星球提供位置服务";
  51. break;
  52. }
  53. }
  54. </script>
  55. </body>
  56. </html>
时间： 2024-12-28 14:29:34

使用HTML5进行地理位置定位。误差在+-500m的相关文章

html5的地理位置定位

html5提供的地理位置定位使开发人员不用借助其他软件就能轻松实现位置查找,地图应用,导航等功能. 地理位置定位基本原理GPS, WIFI, IP, 手机信号基站 核心对象Geolocation是window.navigator下面的一个对象,该对象提供了实现地理位置定位的接口.要用该功能需先判断浏览器是否支持navigator.geolocation对象. navigator.geolocation.getCurrentPosition(success, error, options); su

HTML5获取地理位置定位信息

HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用.本文结合实例给大家分享如何使用HTML5,借助百度.谷歌地图接口来获取用户准确的地理位置信息. 如何使用HTML5地理位置定位功能 定位功能(Geolocation)是HTML5的新特性,因此只有在支持HTML5的现代浏览器上运行,特别是手持设备如iphone,地理定位更加精确.首先我们要检测用户设备浏览器是否支持地理定位,如果支持则获取地理信息.注意这个

html5 Geolocation(地理位置定位)学习

1.html5 Geolocation html5 Geolocation API 使用很简单,请求一个位置信息,如果用户同意,浏览器会返回一个位置信息,该位置是通过用户的底层设备(手机,电脑) 提供给浏览器.位置信息一般包括经度和纬度信息! 经度和纬度坐标信息一般由两种方式表示 a.十进制表示:39.17222 b.DMS角度格式表示:39°10'20" 2.位置从哪里来 html5 Geolocation API不指定设备使用哪种底层技术来定位应用程序的用户,相反,它只是用于检索位置信息的A

webview里HTML5的地理位置定位

//启用数据库 webSettings.setDatabaseEnabled(true); String dir = this.getApplicationContext().getDir("database", Context.MODE_PRIVATE).getPath(); //启用地理定位 webSettings.setGeolocationEnabled(true); //设置定位的数据库路径 webSettings.setGeolocationDatabasePath(dir

HTML5 地理位置定位（HTML5 Geolocation）原理及应用

地理位置(Geolocation)是 HTML5 的重要特性之中的一个,提供了确定用户位置的功能,借助这个特性可以开发基于位置信息的应用. 今天这篇文章向大家介绍一下HTML5 地理位置定位的基本原理及各个浏览器的数据精度情况. 在訪问位置信息前,浏览器都会询问用户是否共享其位置信息,以 Chrome 浏览器为例,假设您同意 Chrome 浏览器与站点共享您的位置,Chrome 浏览器会向 Google 位置服务发送本地网络信息,预计您所在的位置. 然后,浏览器会与请求使用您位置的站点共享您的位

HTML5 地理位置定位（1）

地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个浏览器的数据精度情况. 在访问位置信息前,浏览器都会询问用户是否共享其位置信息,以 Chrome 浏览器为例,如果您允许 Chrome 浏览器与网站共享您的位置,Chrome 浏览器会向 Google 位置服务发送本地网络信息,估计您所在的位置.然后,浏览器会与请求使用您位置的网站共享您的位置. H

HTML5 地理位置定位API（3）

HTML5 地理位置定位实例 这篇文章主要为大家介绍了HTML5地理定位的方法,实例讲述了html5获取坐标完整实现过程, 并对比不同浏览器运行效果给出参考结果,需要的朋友可以参考下 本文实例讲述了html5获取地理定位的方法,分享给大家供大家参考.具体方法如下: html5 获取坐标代码如下: 复制代码 代码如下: <!DOCTYPE HTML> <html> <head> <title>test1.html</title> <meta

HTML5 地理位置定位API（2）

HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Internet Explorer 9.0+ 手机支持情况: Android 2.0+iPhone 3.0+Opera Mobile 10.1+Symbian (S60 3rd & 5th generation)Blackberry OS 6Maemo 检测浏览器是否支持: if (navigator.geol

html5获取地理位置和定位

1.H5地理位置定位功能 首先判断用户浏览器是否支持该功能,目前大多数现代浏览器均支持,获取位置信息需用户授权同意 function getLocation(){ if (navigator.geolocation){ navigator.geolocation.getCurrentPosition(showPosition,showError); }else{ alert("浏览器不支持地理定位."); } } 2.showPosition()获取用户经度纬度 function sh