HTML5根据浏览器获取经度和纬度（百度API）
网页获取用户位置信息的办法
1 调用百度地图的地图标注功能，通过百度地图API获取对应的经度和纬度进而获取地区信息
优点是比较准确，缺点是需要用户自己选择位置
2 通过H5 geolocation属性获取经度和纬度，优点是用户只需要点击允许获取即可，缺点是浏览器获取的经度相对不是很准确而且仍旧需要用户确认。
3 通过用户IP来分析用户位置（待后续研究） 下面是第二种方法的代码实现
<!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
alert('您的浏览器不支持地理位置定位');
}
}
//成功时
function onSuccess(position){
//返回用户位置
//经度
var longitude =position.coords.longitude;
//纬度
var latitude = position.coords.latitude;
alert('经度'+longitude+'，纬度'+latitude); //根据经纬度获取地理位置，不太准确，获取城市区域还是可以的
var map = new BMap.Map("allmap");
var point = new BMap.Point(longitude,latitude);
var gc = new BMap.Geocoder();
gc.getLocation(point, function(rs){
var addComp = rs.addressComponents;
alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);
});
}
//失败时
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>
</body>
</html>
HTML5根据浏览器获取经度和纬度（百度API）的更多相关文章
- Cesium获取经度 ，纬度，高度
实例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...
- 根据经纬度获取位置描述：百度API与高德API的区别
百度API 使用百度坐标 1.访问方式一 http://api.map.baidu.com/geocoder/v2/?location=35.063592,118.38513&output=j ...
- Vue 通过调用百度API获取地理位置-经度纬度省份城市
一.首先在百度api注册获得ak密钥 二.新建js文件,我命名为loadBMap.js,里面创建script,代码如下: /** * 加载地图 * @param {Function} callback ...
- html5获取经纬度，百度api获取街区名，并使用JS保存进cookie
引用js<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak= ...
- Android 获取地理位置的经度和纬度(zz)
在Android应用程序中,可以使用LocationManager来获取移动设备所在的地理位置信息.看如下实例:新建android应用程序TestLocation. 1.activity_main.x ...
- Android开发之旅-获取地理位置的经度和纬度
在Android应用程序中,可以使用LocationManager来获取移动设备所在的地理位置信息.看如下实例:新建android应用程序TestLocation. 1.activity_main.x ...
- 【前端】html5获取经纬度，百度api获取街区名，并使用JS保存进cookie
引用js<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak= ...
- 【转】百度API获取城市名地名(附源码)
在做一个软件时,用到了定位功能.网上有很多关于google 的GPS定位,但网上关于google定位都没有用, 搜索下原因:(这里建议大家在中国就尽量不使用系统自带的定位) 因为Google的服务器不 ...
- java工具类(一)之服务端java实现根据地址从百度API获取经纬度
服务端java实现根据地址从百度API获取经纬度 代码: package com.pb.baiduapi; import java.io.BufferedReader; import java.io. ...
随机推荐
- 借助OpenOffice实现office转pdf（Java）的.exe小程序
原料:OpenOffice4.1.2(之所以选OpenOffice是因为可以跨平台,下载后直接安装),jodconverter-core-3.0-beta-4-dist.zip(可以搜博客园),Exe ...
- svn clean up 出错解决方案
问题描述:svn执行clean up命令时报错"Previous operation has not finished; run 'cleanup' if it was interrupte ...
- unity3d打开对话框
最近一直在忙项目,没时间更新博客,这两天趁空封装windows下的打开对话框,支持多选.其他系统可以用ngui或者ugui封装一个. 这里就不上封装的源码了提供dll供小伙伴们使用,如果有需要源码请请 ...
- 【Map】Double Queue
Double Queue Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 13258 Accepted: 5974 Des ...
- ES 6 : 变量的解构赋值
1. 数组的解构赋值 [ 基本用法 ] 按照一定的模式从数组或者对象中取值,对变量进行赋值的过程称为解构. 以前,为变量赋值只能直接指定值: 而ES 6 允许写成下面这样: 上面的代码表示,可以从数组 ...
- CentOS 6.5静态IP的设置（NAT和桥接都适用）
CentOS 6.5静态IP的设置(NAT和桥接都适用) 为了方便,用Xshell来.并将IP设置为静态的.因为,在CentOS里,若不对其IP进行静态设置的话,则每次开机,其IP都是动态变化的,这样 ...
- 【POJ2186】受牛仰慕的牛
受牛仰慕的牛(popular cows) 每头牛都有一个梦想:成为一个群体中最受欢迎的名牛!在一个有N(1<=N<=10,000)头牛的牛群中,给你M(1<=M<=50,00 ...
- VS2015转VS2008
对于Windows8及以上的系统,无法安装VS2008,也不是无法安装,如果玩游戏多的,应该已经安装了.NET3.5,可以正常安装. 既然不能安装VS2008,那就安装VS2015好了,现在已经是Up ...
- shell的入门
shell :弱类型. 解释型语言 从程序员的角度来看, Shell本身是一种用C语言编写的程序,从用户的角度来看,Shell是用户与Linux操作系统沟通的桥梁.用户既可以输入命令执行,又可以利用 ...
- 《JavaScript DOM编程艺术》读书笔记
这是自己JS入门的一本书,反复看过几遍,作者的文笔风趣,阅读起来不枯燥也显轻松~ 本书从JS简史讲到基础语法到DOM,再以一个图片库案例为主线,讲如何运用JS来实现想要的动效,同时对已写案例进行兼容优 ...