`
zhangbaoming815
  • 浏览: 147525 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

html5 定位,地理位置

阅读更多

使用html5定位你的地理位置

自从定位技术让步于个人隐私,指定位置只能在用户许可的情况下使用

通过使用getCurrentPosition()方法来获得用户的位置

下面的例子返回用户的经度和纬度:

并在图中显示出来,在使用时当请求跟踪位置的时候选择允许跟踪:

<body>
<p id="demo">Click the button to get your position:</p>
<button onclick="getLocation()">Try It</button>
<div id="mapholder"></div>
<script>
	var x=document.getElementById("demo");
	function getLocation()
	  {
	  if (navigator.geolocation)
		{
		navigator.geolocation.getCurrentPosition(showPosition,showError);
		}
	  else{x.innerHTML="Geolocation is not supported by this browser.";}
	  }

	function showPosition(position)
	  {
	  var latlon=position.coords.latitude+","+position.coords.longitude;

	  var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
		  +latlon+"&zoom=14&size=400x300&sensor=false";
		  document.getElementById("mapholder").innerHTML="<img src='"+img_url+"' />";
	  }

	function showError(error)
	  {
	  switch(error.code) 
		{
			case error.PERMISSION_DENIED:
			  x.innerHTML="User denied the request for Geolocation."
			  break;
			case error.POSITION_UNAVAILABLE:
			  x.innerHTML="Location information is unavailable."
			  break;
			case error.TIMEOUT:
			  x.innerHTML="The request to get user location timed out."
			  break;
			case error.UNKNOWN_ERROR:
			  x.innerHTML="An unknown error occurred."
			  break;
		}
	  }
</script>
</body>
 
分享到:
评论

相关推荐

    HTML5地理位置定位

    This concise book demonstrates the W3C Geolocation API in action, with code and examples to help you build HTML5 apps using the "write once, deploy everywhere" model. Along the way, you get a crash ...

    html5地理位置定位功能.zip

    H5定位

    HTML5实现获取地理位置信息并定位功能

    HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用。本文结合实例给大家分享如何使用HTML5,借助百度、谷歌地图接口来获取用户准确的地理位置...

    基于HTML5的地理位置定位实验代码

    利用Html5的新特性geolocation可以获取用户的地理位置定位信息,并借助百度活google的地图api将所获取的地理位置信息展示在地图上。 做这个实验时必须保证测试的页面部署在HTTP服务器上,否则如果直接浏览器从本地...

    [HTML5地理位置定位]

    [HTML5地理位置定位]~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    html5中地理位置定位api接口开发应用小结

    地理位置定位的几种方式:IP地址,GPS,Wifi,GSM/CDMA 地理位置获取流程: 1、用户打开需要获取地理位置的web应用。 2、应用向浏览器请求地理位置,浏览器弹出询问,询问用户是否共享地理位置。 3、假设用户允许,...

    如何使用HTML5地理位置定位功能

    HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用。本文结合实例给大家分享如何使用HTML5,借助百度、谷歌地图接口来获取用户准确的地理位置...

    HTML5的Geolocation地理位置定位API使用教程

    地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用,今天这篇文章就向大家介绍一下HTML5的Geolocation地理位置定位API使用教程.

    googlemap 经纬度 地理位置查询

    一个google map小应用 应用google map api可以获得点的经纬度并且可以根据地理位置名称定位。

    HTML离线应用城西获取地理位置PPT

    有关HTML5地理位置的学习,通过这个ppt,你可以很快的了解到html5最新的一些知识,地图,定位等都能够在这个里面学习到。

    Html5 Geolocation获取地理位置信息实例

    主要介绍了Html5 Geolocation获取地理位置信息实例,具有一定的参考价值,有兴趣的同学可以了解一下。

    手机web端地理位置定位代码

    用于手机WEB端地理位置定位代码,你可以根据其代码功能进行拓展和完善

    geolocation:HTML5 地理定位

    地理位置 介绍 这是将检查当前浏览器是否支持 navigator.geolocation 对象的示例网页。 如果浏览器不支持地理定位,则让页面向用户显示反馈消息。 如果支持地理定位,则尝试获取用户的当前位置,然后加载包含地图...

    Android中WebView控件支持地理位置定位方法

    Android WebView从assets中加载html5页面,实现地理位置定位,有需要的朋友可以参考下。 今天调研一个html5页面的定位问题,发现在手机浏览器上html5是可以实现定位的,但是在webview中就无法定位了。而我居然以为...

    5.地理定位.pdf_html5_hospitaldev_

    HTML5 Geolocation API 用于获得用户的地理位置,使用 getCurrentPosition() 方法来获得用户的位置。

    利用HTML5中Geolocation获取地理位置调用Google Map API在Google Map上定位

    本小菜刚开始学习HTML5,现在对其中的Geolocation颇感兴趣,结合Google Map的API实现基本的地图定位功能主要是由以下几个步骤:获取当前地理位置、调用Google Map API获取当前位置信息

    HTML5 Geolocation(地理定位)

    HTML5 Geolocation API 用于获得用户的地理位置。 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。 浏览器支持 Internet Explorer 9+, Firefox, Chrome, Safari 和 Opera 支持...

Global site tag (gtag.js) - Google Analytics