HTML5 定位

最新推荐文章于 2024-05-11 10:39:22 发布
最新推荐文章于 2024-05-11 10:39:22 发布
阅读量217 收藏 1
点赞数
文章标签： json 移动开发 runtime
原文链接：https://my.oschina.net/u/1266171/blog/841643
版权

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

API Reference

Native.js

 

geolocation常见问题我要提意见

Geolocation模块管理设备位置信息，用于获取地理位置信息，如经度、纬度等。通过plus.geolocation可获取设备位置管理对象。虽然W3C已经提供标准API获取位置信息，但在某些平台存在差异或未实现，为了保持各平台的统一性，定义此规范接口获取位置信息。

方法：

对象：

回调方法：

权限：

5+功能模块（permissions）


{
// ...
"permissions":{
	// ...
	"Geolocation": {
		"description": "位置信息"
	}
}
}

getCurrentPosition

获取当前设备位置信息


void plus.geolocation.getCurrentPosition( successCB, errorCB, option );

说明：

位置信息将通过手机GPS设备或其它信息如IP地址、移动网络信号获取，由于获取位置信息可能需要较长的时间，当成功获取位置信息后将通过successCB回调函数返回。

参数：

返回值：

void : 无

平台支持：

  • Android - 2.2+ (支持): 支持
  • iOS - 4.3+ (支持): 支持

示例：


<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Geolocation Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
	plus.geolocation.getCurrentPosition( function ( p ) {
		alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
	}, function ( e ) {
		alert( "Geolocation error: " + e.message );
	} );
}
	</script>
	</head>
	<body >
	</body>
</html>

watchPosition

监听设备位置变化信息


Number plus.geolocation.watchPosition( successCB, errorCB, option );

说明：

位置信息将通过手机GPS设备或其它信息如IP地址、移动网络信号获取。当位置信息更新后将通过successCB回调函数返回。位置信息获取失败则调用回调函数errorCB。

参数：

返回值：

Number : 用于标识位置信息监听器，可通过clearWatch方法取消监听。

平台支持：

  • Android - 2.2+ (支持): 支持
  • iOS - 4.3+ (支持): 支持

示例：


<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Geolocation Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
	plus.geolocation.watchPosition( function ( a ) {
			alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
	}, function ( e ) {
		alert( "Geolocation error: " + e.message );
	} ); 
}
	</script>
	</head>
	<body >
	</body>
</html>

clearWatch

关闭监听设备位置信息


void plus.geolocation.clearWatch( watchId );

参数：

  • watchId: ( Number ) 必选
    需要取消的位置监听器标识，调用watchPosition方法的返回值。

返回值：

void : 无

平台支持：

  • Android - 2.2+ (支持): 支持
  • iOS - 4.3+ (支持): 支持

示例：


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Geolocation Example</title>
		<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕，现在可以正常调用扩展API
var wid = null;
function onPlusReady() {
	wid = plus.geolocation.watchPosition( function ( p ) {
	alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
	}, function ( e ) {
	alert( "Geolocation error: " + e.message );
	} );
}
function cancel() {
	plus.geolocation.clearWatch( wid );
	wid = null;
}
		</script>
	</head>
	<body >
		<input type="button" value="Cancel" onclick="cancel();" ></input>
	</body>
</html>

Position

JSON对象，设备位置信息数据


interface Position {
	readonly attribute Coordinates coords;
	readonly attribute String coordsType;
	readonly attribute Number timestamp;
	readonly attribute Address address;
	readonly attribute String addresses;
}

属性：

  • coords: (Coordinates 类型 )地理坐标信息，包括经纬度、海拔、速度等信息
  • coordsType: (String 类型 )获取到地理坐标信息的坐标系类型

    可取以下坐标系类型： “gps”：表示WGS-84坐标系； “gcj02”：表示国测局经纬度坐标系； “bd09”：表示百度墨卡托坐标系； “bd09ll”：表示百度经纬度坐标系。

  • timestamp: (Number 类型 )获取到地理坐标的时间戳信息

    时间戳值为从1970年1月1日至今的毫秒数。

  • address: (Address 类型 )获取到地理位置对应的地址信息

    获取地址信息需要连接到服务器进行解析，所以会消耗更多的资源，如果不需要获取地址信息可通过设置PositionOptions参数的geocode属性值为false避免获取地址信息。 如果没有获取到地址信息则返回undefined。

    平台支持

    • Android - 2.3+ (支持): 使用系统定位模块无法获取位置信息。
    • iOS - 5.1+ (支持): 系统定位模块也支持获取位置信息。
  • addresses: (String 类型 )获取完整地址描述信息

    如果没有获取到地址信息则返回undefined。

    平台支持

    • Android - 2.3+ (支持): 使用系统定位模块无法获取位置信息。
    • iOS - 5.1+ (支持): 系统定位模块也支持获取位置信息。

Address

JSON对象，地址信息


interface Address {
	readonly attribute String country;
	readonly attribute String province;
	readonly attribute String city;
	readonly attribute String district;
	readonly attribute String street;
	readonly attribute String poiName;
	readonly attribute String postalCode;
	readonly attribute String cityCode;
}

属性：

  • country: (String 类型 )国家

    如“中国”，如果无法获取此信息则返回undefined。

  • province: (String 类型 )省份名称

    如“北京市”，如果无法获取此信息则返回undefined。

  • city: (String 类型 )城市名称

    如“北京市”，如果无法获取此信息则返回undefined。

  • district: (String 类型 )区（县）名称

    如“朝阳区”，如果无法获取此信息则返回undefined。

  • street: (String 类型 )街道和门牌信息

    如“酒仙桥路”，如果无法获取此信息则返回undefined。

  • poiName: (String 类型 )POI信息

    如“电子城．国际电子总部”，如果无法获取此信息则返回undefined。

  • postalCode: (String 类型 )邮政编码

    如“100016”，如果无法获取此信息则返回undefined。

  • cityCode: (String 类型 )城市代码

    如“010”，如果无法获取此信息则返回undefined。

Coordinates

JSON对象，地理坐标信息


interface Coordinates {
	readonly attribute double latitude;
	readonly attribute double longitude;
	readonly attribute double altitude;
	readonly attribute double accuracy;
	readonly attribute double altitudeAccuracy;
	readonly attribute double heading;
	readonly attribute double speed;
}

属性：

  • latitude: (Number 类型 )坐标纬度值

    数据类型对象，地理坐标中的纬度值。

  • longitude: (Number 类型 )坐标经度值

    数据类型对象，地理坐标中的经度值。

  • altitude: (Number 类型 )海拔信息

    数据类型对象，如果无法获取此信息，则此值为空（null）。

  • accuracy: (Number 类型 )地理坐标信息的精确度信息

    数据类型对象，单位为米，其有效值必须大于0。

  • altitudeAccuracy: (Number 类型 )海拔的精确度信息

    数据类型对象，单位为米，其有效值必须大于0。如果无法获取海拔信息，则此值为空（null）。

  • heading: (Number 类型 )表示设备移动的方向

    数据类型对象，范围为0到360，表示相对于正北方向的角度。如果无法获取此信息，则此值为空（null）。如果设备没有移动则此值为NaN。

  • speed: (Number 类型 )表示设备移动的速度

    数据类型对象，单位为米每秒（m/s），其有效值必须大于0。如果无法获取速度信息，则此值为空（null）。

PositionOptions

JSON对象，监听设备位置信息参数

属性：

  • enableHighAccuracy: (Boolean 类型 )是否高精确度获取位置信息

    高精度获取表示需要使用更多的系统资源，默认值为false。

  • timeout: (Number 类型 )获取位置信息的超时时间

    单位为毫秒（ms），默认值为不超时。如果在指定的时间内没有获取到位置信息则触发错误回调函数。

  • maximumAge: (Number 类型 )获取位置信息的间隔时间

    单位为毫秒（ms），默认值为5000（即5秒）。调用plus.geolocation.watchPosition时为更新位置信息的间隔时间。 注意：在不同定位模块下支持范围值可能不同，如百度定位模块的间隔范围为大于等于1秒，如果设置的值小于最小值则使用最小值。

  • provider: (String 类型 )优先使用的定位模块

    可取以下供应者： "system"：表示系统定位模块，支持wgs84坐标系； "baidu"：表示百度定位模块，支持gcj02/bd09/bd09ll坐标系； "amap"：表示高德定位模板，支持gcj02坐标系。 默认值按以下优先顺序获取（amap>baidu>system），若指定的provider不存在或无效则返回错误回调。 注意：百度/高德定位模块需要配置百度/高德地图相关参数才能正常使用。

    平台支持

    • Android - 2.2+ (支持)
    • iOS - 4.5+ (支持): provider为“baidu”时，仅支持bd09ll坐标系，暂不支持高德定位模块。
    
<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Geolocation Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
	// 使用百度地图地位模块获取位置信息
	plus.geolocation.getCurrentPosition( function ( p ) {
		alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
	}, function ( e ) {
		alert( "Geolocation error: " + e.message );
	},{provider:'baidu'});
}
	</script>
	</head>
	<body >
	</body>
</html>
  • coordsType: (String 类型 )指定获取的定位数据坐标系类型

    可取以下坐标系类型： “wgs84”：表示WGS-84坐标系； “gcj02”：表示国测局经纬度坐标系； “bd09”：表示百度墨卡托坐标系； “bd09ll”：表示百度经纬度坐标系； provider为“system”时，默认使用“wgs84”类型；provider为“baidu”是，默认使用“bd09ll”类型。 如果设置的坐标系类型provider不支持，则返回错误。

  • geocode: (Boolean 类型 )是否解析地址信息

    解析的地址信息保存到Position对象的address、addresses属性中，true表示解析地址信息，false表示不解析地址信息，返回的Position对象的address、addresses属性值为undefined，默认值为true。 如果解析地址信息失败则返回的Position对象的address、addresses属性值为null。

GeolocationError

JSON对象，定位错误信息


interface GeolocationError {
	const Number PERMISSION_DENIED = 1;
	const Number POSITION_UNAVAILABLE = 2;
	const Number TIMEOUT = 3;
	const Number UNKNOWN_ERROR = 4;
	readonly attribute Number code;
	readonly attribute String message;
}

常量：

  • PERMISSION_DENIED: (Number 类型 )访问权限被拒绝

    系统不允许程序获取定位功能，错误代码常量值为1。

  • POSITION_UNAVAILABLE: (Number 类型 )位置信息不可用

    无法获取有效的位置信息，错误代码常量值为2。

  • TIMEOUT: (Number 类型 )获取位置信息超时

    无法在指定的时间内获取位置信息，错误代码常量值为3。

  • UNKNOWN_ERROR: (Number 类型 )未知错误

    其它未知错误导致无法获取位置信息，错误代码常量值为4。

属性：

  • code: (Number 类型 )错误代码

    取值范围为GeolocationError对象的常量值。

  • message: (String 类型 )错误描述信息

    详细错误描述信息。

GeolocationSuccessCallback

获取设备位置信息成功的回调函数


void onSuccess( position ) {
	// Get Position code.
}

参数：

  • position: ( Position ) 必选 设备的地理位置信息，参考Position

返回值：

void : 无

示例：


<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Geolocation Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
	plus.geolocation.getCurrentPosition( function ( p ) {
		alert( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
		console.log( "Geolocation info: " + JSON.stringify(p) );
	}, function ( e ) {
		console.log("Gelocation Error: code - "+e.code+"; message - "+e.message);
	} );
}
	</script>
	</head>
	<body >
	</body>
</html>

GeolocationErrorCallback

获取设备位置信息失败的回调函数


function void onGeolocationError( GeolocationError error ) {
	// Handle error
	var code = error.code; // 错误编码
	var message = error.message; // 错误描述信息
}

参数：

  • error: ( GeolocationError ) 必选 获取位置操作的错误信息
    可通过error.code（Number类型）获取错误编码； 可通过error.message（String类型）获取错误描述信息。

返回值：

void : 无

示例：


<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Geolocation Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
	plus.geolocation.getCurrentPosition( function ( p ) {
		console.log( "Geolocation\nLatitude:" + p.coords.latitude + "\nLongitude:" + p.coords.longitude + "\nAltitude:" + p.coords.altitude );
	}, function ( e ) {
		console.log("Gelocation Error: code - "+e.code+"; message - "+e.message);
        switch(e.code) {
          case e.PERMISSION_DENIED:
              alert("User denied the request for Geolocation.");
              break;
          case e.POSITION_UNAVAILABLE:
              alert("Location information is unavailable.");
              break;
          case e.TIMEOUT:
              alert("The request to get user location timed out.");
              break;
          case e.UNKNOWN_ERROR:
              alert("An unknown error occurred.");
              break;
          }
	} );
}
	</script>
	</head>
	<body >
	</body>
</html>

京ICP备12046007号-5 HTML5中国产业联盟版权所有

转载于:https://my.oschina.net/u/1266171/blog/841643

weixin_33929309
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
GeolocationPlus:Omeka Classic─具有新功能的地理定位插件
05-09
具有附加功能的地理位置插件 原始插件： | 允许管理用户保存单个项目的地理位置数据。 该插件会生成一个Google地图，其中包含带有地理位置数据的项目以及一个用于显示地图的网页。 安装 ，解压缩文件并重命名插件文件夹“ Geolocation”。 将Geolocation文件夹复制到Omeka根目录安装的“ plugins”文件夹中。 （请参阅） 在Omeka管理界面中，单击屏幕右上方的“设置”按钮，转到“插件”选项卡，然后单击地理位置列表旁边的“安装”按钮。 附加的功能 边界框面积 插件： “空间覆盖率”同步 反向“空间覆盖率”同步
html5定位并在百度地图上显示的示例
09-28
本文将详细介绍如何使用HTML5的Geolocation API实现定位功能，并将获取到的位置在百度地图上进行显示，同时会涉及到百度地图API提供的坐标转换功能，以保证定位准确性。 首先，HTML5 Geolocation API是基于浏览器的...
html5+ geolocation-位置信息
wlor的博客
10-09 3592
geolocation-位置信息 Geolocation模块管理设备位置信息，用于获取地理位置信息，如经度、纬度等。通过plus.geolocation可获取设备位置管理对象。虽然W3C已经提供标准API获取位置信息，但在某些平台存在差异或未实现，为了保持各平台的统一性，定义此规范接口获取位置信息。 方法： getCurrentPosition: 获取当前设备位置信息 watchPosition...
HTML5+ plus.maps地图详解（官方文档）
热门推荐
飞鱼
08-17 2万+
HTML5 Geolocation（地理定位）
12-14
HTML5 Geolocation（地理定位） HTML5 Geolocation（地理定位）用于定位用户的位置。 定位用户的位置 HTML5 Geolocation API 用于获得用户的地理位置。 鉴于该特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的。 浏览器支持 Internet Explorer 9+, Firefox, Chrome, Safari 和 Opera 支持Geolocation（地理定位）. 注意: Geolocation（地理定位）对于拥有 GPS 的设备，比如 iPhone，地理定位更加精确。 HTML5 – 使用地理定位 请使用 ge
HBulider调用高德地图获取不到详细位置信息 plus.geolocation.getCurrentPosition
jrl0920的博客
02-17 1192
@TOCHbuliderX 高德Api 更新Hbuilder X 3.3.11plus.geolocation.getCurrentPosition 无法获取详细地址 只需要在方法回调中添加参数provider:‘amap’ 示例代码 plus.geolocation.PositionOptions(function(){}, function(){}, {provider:‘amap’}); ...
Html5定位终极解决方案
11-21
【Html5定位终极解决方案】 在开发H5商城项目时，特别是在微信环境中，获取用户精确的地理位置信息是一项关键任务。这通常涉及到使用HTML5的Geolocation API来定位用户，或者利用第三方地图服务提供商如百度或腾讯...
html5定位实例资源
06-21
HTML5定位技术是现代网页开发中的重要特性，它极大地增强了网页与用户交互的能力。这个“html5定位实例资源”很可能是包含了一些展示如何在网页中使用HTML5定位功能的示例代码和教程。HTML5的定位功能主要由...
百度定位.zip_html5 定位_定位_百度定位
07-15
在IT行业中，HTML5定位是一项重要的技术，它允许网页应用获取用户的位置信息，极大地提升了Web应用的交互性和实用性。此“百度定位.zip”文件显然包含了关于如何利用HTML5结合百度地图API实现定位功能的资源。下面...
html5 定位html5 定位html5 定位html5 定位
07-04
通过HTML5定位城市，返回城市圈名称(如：中国陕西省西安雁塔区沣惠南路26号 邮政编码: 710075)；
geolocationJS
03-27
地理定位 仅学习资料
geolocation-js:使用 JavaScript 的 HTML5 地理定位实现
06-18
地理定位.js 使用 JavaScript 的 HTML5 地理定位实现 此项目已从 Google Code 迁移。 geolocation.js 简介 - 在不支持 HTML5 地理定位的浏览器中可用。 位置信息在上提供。 怎样申请 < script type =" text/javascript " src =" http://j.maxmind.com/app/geoip.js " > </ script > < script type =" text/javascript " src =" geolocation.js " > </ script >
h5 plus 获取位置权限
沙鑫741的博客
07-16 2390
function onPlusReady(){ plus.geolocation.getCurrentPosition(function(p){ console.log('Geolocation\nLatitude:' + p.coords.latitude + '\nLongitude:' + p.coords.longitude + '\nAltitude:' + p.coords.a...
H5+ 跨平台APP - geolocation获取设备当前位置
六国破灭，非兵不利 ，战不善，弊在赂秦。赂秦而力亏，破灭之道也。或曰：六国互丧，率赂秦耶？曰：不赂者以赂者丧，盖失强援，不能独完。故曰：弊在赂秦也。 秦以攻取之外，小则获邑，大则得城。较秦之所得，与战胜而得者，其实百倍；诸侯之所亡，与战败而亡者，其实亦百
09-04 2277
1、获取当前设备位置信息getCurrentPosition plus.geolocation.getCurrentPosition(successCB, errorCB, option); 参数： successCB:(GeolocationSuccessCallback) 必选获取设备位置信息成功回调函数 errorCB:(GeolocationErrorCallbac...
2024年力扣热门100题之字母异位词分组【中等】(1)，2024年最新微信小程序页面跳转方法总结
最新发布
2401_84910943的博客
05-11 452
输入: strs = [“eat”, “tea”, “tan”, “ate”, “nat”, “bat”]输出: [[“bat”],[“nat”,“tan”],[“ate”,“eat”,“tea”]]解法1：字符串拆分后排序，再聚合，最后再使用哈希归类。输入: strs = [“a”]解法2：求字符串权值，按权值分类。输入: strs = [“”]strs[i] 仅包含小写字母。输出: [[“a”]]输出: [[“”]]
android gps 获取方位_android – 如何使用GPS和位置管理器获取当前位置的完整详细信息...
weixin_39682673的博客
01-12 215
我使用GPS来获取位置的经度和纬度,但现在我想得到位置的每个细节,如：国家,城市,州,邮政编码,街道号码等.当前位置的最大细节.码：public class GPSTracker extends Service implements LocationListener {private final Context mContext;// flag for GPS statusboolean isGP...
12模块-geolocation【管理设备位置信息用于定位】
weixin_30566149的博客
07-17 299
Geolocation模块管理设备位置信息，用于获取地理位置信息，如经度、纬度等。通过plus.geolocation可获取设备位置管理对象。虽然W3C已经提供标准API获取位置信息，但在某些平台存在差异或未实现，为了保持各平台的统一性，定义此规范接口获取位置信息。<!DOCTYPE html><html> <head> <meta charset="u...
HTML5+ 手机端获取设备当前地理位置 geolocation
dianlupeng4187的博客
07-28 1491
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>We...
H5之11__GeoLocation 地理定位
daozhongyang的专栏
11-30 1801
GeoLocation API 通常用于移动设备获取地理位置，严格来说，并不属于H5的标准规范. 一 如何使用 GeoLocation API? 要使用该API, 通过window.navigator.geolocatio 获得 对地理定位的访问。 该对象有如下三个方法： 1. getCurrentPosition() 2. watchPosition() 3. cle
HTML5定位技术：手机应用与网页时髦新趋势
《HTML5 Geolocation》为读者提供了一把解锁现代Web应用地理定位功能的钥匙，是推动Web应用向更个性化、交互式方向发展的核心技术之一。通过阅读这本书，开发者不仅能掌握基础概念，还能学习到如何在实际项目中巧妙...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值