html5获取js获取坐标的方法
navigator.geolocation.getCurrentPosition(successCallback,
errorCallback, options);
成功函数将通过一个单独的 Position
类型的参数传递。这个对象有两个属性：一个时间戳的属性和称为坐标的 Coordinates
类型的属性。一个 Coordinates
对象有几个属性：
- latitude
- longitude
- altitude
- accuracy
- altitudeAccuracy
- heading
- speed
这些参数不是在所有设备上都可用，除了 latitude、longitude 和 accuracy。如果支持地理定位
API，并且设备可以解析位置，就可以获取 latitude、longitude 和 accuracy。
失败 callback
函数将传递一个 PositionError
类型参数。PositionError
实例有两个参数：code 和 message。message 是设备特定的，可用于调试。code 有以下三个取值：
-
PERMISSION_DENIED (1)
-
POSITION_UNAVAILABLE (2)
-
TIMEOUT (3)
更高级的内容：追踪
id= navigator.geolocation.watchPosition(function(pos){});
成功函数将通过一个单独的 Position
类型的参数传递。这个对象有两个属性：一个时间戳的属性和称为坐标的 Coordinates
类型的属性。一个 Coordinates
对象有几个属性：
- latitude
- longitude
- altitude
- accuracy
- altitudeAccuracy
- heading
- speed
创建地图并放置标记后，开始追踪用户。捕获从 watchPosition
中返回的
ID。无论何时接收到新的位置，都将地图在新位置重新居中，并将标记移到新位置
结合google map示意代码
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>I'm tracking you!</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?
sensor=true"></script>
<script type="text/javascript">
var trackerId = 0;
var geocoder;
var theUser = {};
var map = {};
function initialize() {
geocoder = new google.maps.Geocoder();
if (navigator.geolocation){
var gps = navigator.geolocation;
gps.getCurrentPosition(function(pos){
var latLng = new google.maps.LatLng(pos.coords.
latitude,pos.coords.longitude);
var opts = {zoom:12, center:latLng, mapTypeId:
google.maps.MapTypeId.ROADMAP};
map = new google.maps.Map($("map_canvas"), opts);
theUser = new google.maps.Marker({
position: latLng,
map: map,
title: "You!"
});
showLocation(pos);
});
trackerId = gps.watchPosition(function(pos){
var latLng = new google.maps.LatLng(pos.coords.latitude,pos.
coords.longitude);
map.setCenter(latLng);
theUser.setPosition(latLng);
showLocation(pos);
});
}
}
</script>
</head>
<body style="margin:0px; padding:0px;" onload="initialize()">
<div id="superbar">
<span class="msg">Current location:
<span id="location"></span>
</span>
<input type="button" value="Stop tracking me!"
onclick="stopTracking()"/>
</div>
<div id="map_canvas" style="width:100%; height:90%; float:left;
border: 1px solid black;">
</div>
</body>
</html>
详细请见：
http://www.ibm.com/developerworks/cn/xml/x-html5mobile1/
分享到：
相关推荐
在本教程的后续部分，会进一步介绍如何结合HTML5地理定位API与其他Web服务创建复杂的移动混搭程序。通过具体的案例研究，学习如何有效地整合地理位置信息与第三方服务，构建实用的移动应用。 - **案例研究**：例如...
ArcGIS JavaScript API是Esri公司开发的一款强大的Web GIS开发工具，主要用于构建交互式的地理信息系统（GIS）应用程序。在3.32版本的SDK中，开发者可以找到丰富的资源和文档，帮助他们利用JavaScript语言构建基于...
书中详细阐述了这些驱动力和模式如何相互作用，推动Web 2.0的发展，并提供了案例分析和实践指导，帮助读者理解如何在实际操作中运用这些原理和最佳实践，以创建和优化成功的Web 2.0项目。无论是营销专业人士、开发者...
1. ** Qt WebKit 模块**：允许将 Web 内容嵌入到 Qt 应用中，无论是来自服务器、本地文件还是应用程序资源。 2. ** Qt Script 模块**：使 Qt 应用程序可以被脚本化，即可以通过 JavaScript 来控制 Qt 应用的行为。 3...
在开发工具方面，9.3版引入了新的Web混搭构建工具，以及基于.NET Framework的ArcGIS Server REST API和Services Directory Web应用，使得Web应用程序的开发更加高效。同时，Web ADF（Application Development ...
此外，Java EE（Enterprise Edition）平台也提供了丰富的API和服务，支持Web 2.0的应用开发，如Servlets、JSP（JavaServer Pages）、JSF（JavaServer Faces）等。 Java新技术的发展还涵盖了云计算、大数据、微服务...
5. **详尽的文档和API**：ECharts提供详细的官方文档和API参考，方便开发者快速上手和定制图表。 要开始使用ECharts，首先需要从其官网下载所需版本。例如，选择完整版的echarts.min.js文件，并将其放入项目目录下...
总的来说，Echarts是一个强大的数据可视化工具，它简化了Web应用中的数据展示，同时提供了丰富的交互功能，使得数据分析和展示更加直观易懂。无论是对于新手还是有经验的开发者，Echarts都是一个值得学习和使用的...
这个应用巧妙地结合了地图服务、电影数据和地理位置API，为用户提供了一个方便快捷的电影推荐平台。 首先，我们要了解Redbox是什么。Redbox是一家美国公司，提供自助式DVD、蓝光和游戏租赁服务，用户可以在遍布全美...
总的来说，"remixed2recipes"项目可能是一个综合性的C#应用，旨在帮助用户创建、分享和探索各种混搭食谱，同时也可能涉及技术如数据库管理、API集成、用户界面设计和测试策略。为了深入了解，需要进一步分析解压后的...
在实际开发中，验证码不仅应用于Web应用，还可以扩展到移动应用、API服务等领域。随着人工智能的发展，验证码也在不断进化，例如引入更复杂的图像识别问题（如识别物体、算术问题等）以对抗AI破解。 总之，`captcha...