HTML5 Geolocation API (地理位置应用程序接口)获取地理位置

本文主要是介绍HTML5 Geolocation API (地理位置应用程序接口)获取地理位置,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

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 6
Maemo

检测浏览器是否支持:

 if (navigator.geolocation) {//console.log("浏览器支持!");
 }
else {// console.log("浏览器不支持!");}

navigator.geolocation用于获取基于浏览器的当前用户地理位置,提供了3个方法:

复制代码
void getCurrentPosition(onSuccess,onError,options);
//获取用户当前位置int watchCurrentPosition(onSuccess,onError,options);
//持续获取当前用户位置void clearWatch(watchId);
//watchId 为watchCurrentPosition返回的值
//取消监控
复制代码

onSuccess方法成功时调用的(必选),onError方法失败是调用的(可选),options其他参数(可选)

options:

options = {enableHighAccuracy,   //boolean 是否要求高精度的地理信息timeout,         //表示等待响应的最大时间,默认是0毫秒,表示无穷时间maximumAge        /应用程序的缓存时间
}

onsuccess方法中会返回position对象,通过这个对象可以获取地理位置的相关信息

 

复制代码
<!DOCTYPE html>  
<html>  
<head>  <meta charset="utf-8"/>  <title>基于浏览器的HTML5查找地理位置</title> <!-- 百度API --><script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script>  <script>function getLocation(){var options={enableHighAccuracy:true, maximumAge:1000}if(navigator.geolocation){//浏览器支持geolocation
                   navigator.geolocation.getCurrentPosition(onSuccess,onError,options);}else{//浏览器不支持geolocation
               }}//成功时function onSuccess(position){//返回用户位置//经度var longitude =position.coords.longitude;//纬度var latitude = position.coords.latitude;//使用百度地图API//创建地图实例  var map =new BMap.Map("container");//创建一个坐标var point =new BMap.Point(longitude,latitude);//地图初始化,设置中心点坐标和地图级别  
               map.centerAndZoom(point,15);}//失败时function onError(error){switch(error.code){case 1:alert("位置服务被拒绝");break;case 2:alert("暂时获取不到位置信息");break;case 3:alert("获取信息超时");break;case 4:alert("未知错误");break;}}window.onload=getLocation;</script>
</head>
<body><div id="container" style="width:600px;height:600px"></div>
</body>
</html>
复制代码

 

获取当前位置加上偏移量会准一点 

经度+经度校正值: 0.008774687519;
纬度+纬度校正值: 0.00374531687912;

这篇关于HTML5 Geolocation API (地理位置应用程序接口)获取地理位置的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1043932

相关文章

在Ubuntu上部署SpringBoot应用的操作步骤

《在Ubuntu上部署SpringBoot应用的操作步骤》随着云计算和容器化技术的普及,Linux服务器已成为部署Web应用程序的主流平台之一,Java作为一种跨平台的编程语言,具有广泛的应用场景,本... 目录一、部署准备二、安装 Java 环境1. 安装 JDK2. 验证 Java 安装三、安装 mys

Python中构建终端应用界面利器Blessed模块的使用

《Python中构建终端应用界面利器Blessed模块的使用》Blessed库作为一个轻量级且功能强大的解决方案,开始在开发者中赢得口碑,今天,我们就一起来探索一下它是如何让终端UI开发变得轻松而高... 目录一、安装与配置:简单、快速、无障碍二、基本功能:从彩色文本到动态交互1. 显示基本内容2. 创建链

Node.js 中 http 模块的深度剖析与实战应用小结

《Node.js中http模块的深度剖析与实战应用小结》本文详细介绍了Node.js中的http模块,从创建HTTP服务器、处理请求与响应,到获取请求参数,每个环节都通过代码示例进行解析,旨在帮... 目录Node.js 中 http 模块的深度剖析与实战应用一、引言二、创建 HTTP 服务器:基石搭建(一

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用

java中VO PO DTO POJO BO DO对象的应用场景及使用方式

《java中VOPODTOPOJOBODO对象的应用场景及使用方式》文章介绍了Java开发中常用的几种对象类型及其应用场景,包括VO、PO、DTO、POJO、BO和DO等,并通过示例说明了它... 目录Java中VO PO DTO POJO BO DO对象的应用VO (View Object) - 视图对象

python获取当前文件和目录路径的方法详解

《python获取当前文件和目录路径的方法详解》:本文主要介绍Python中获取当前文件路径和目录的方法,包括使用__file__关键字、os.path.abspath、os.path.realp... 目录1、获取当前文件路径2、获取当前文件所在目录3、os.path.abspath和os.path.re

Go信号处理如何优雅地关闭你的应用

《Go信号处理如何优雅地关闭你的应用》Go中的优雅关闭机制使得在应用程序接收到终止信号时,能够进行平滑的资源清理,通过使用context来管理goroutine的生命周期,结合signal... 目录1. 什么是信号处理?2. 如何优雅地关闭 Go 应用?3. 代码实现3.1 基本的信号捕获和优雅关闭3.2

Java子线程无法获取Attributes的解决方法(最新推荐)

《Java子线程无法获取Attributes的解决方法(最新推荐)》在Java多线程编程中,子线程无法直接获取主线程设置的Attributes是一个常见问题,本文探讨了这一问题的原因,并提供了两种解决... 目录一、问题原因二、解决方案1. 直接传递数据2. 使用ThreadLocal(适用于线程独立数据)

正则表达式高级应用与性能优化记录

《正则表达式高级应用与性能优化记录》本文介绍了正则表达式的高级应用和性能优化技巧,包括文本拆分、合并、XML/HTML解析、数据分析、以及性能优化方法,通过这些技巧,可以更高效地利用正则表达式进行复杂... 目录第6章:正则表达式的高级应用6.1 模式匹配与文本处理6.1.1 文本拆分6.1.2 文本合并6

python中的与时间相关的模块应用场景分析

《python中的与时间相关的模块应用场景分析》本文介绍了Python中与时间相关的几个重要模块:`time`、`datetime`、`calendar`、`timeit`、`pytz`和`dateu... 目录1. time 模块2. datetime 模块3. calendar 模块4. timeit