根据HTML5 获取当前位置的经纬度【百度地图】【高德地图】
是想让地图的定位用户位置更准确一些。
查看了介绍： http://www.w3school.com.cn/html5/html_5_geolocation.asp
看介绍中拿数据挺简单。
<!DOCTYPE html>
<html>
<body>
<p id="demo">点击这个按钮，获得您的坐标：</p>
<button onclick="getLocation()">试一下</button>
<script>
var x=document.getElementById("demo");
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition);
}
else{x.innerHTML="Geolocation is not supported by this browser.";}
}
function showPosition(position)
{
x.innerHTML="Latitude: " + position.coords.latitude +
"<br />Longitude: " + position.coords.longitude;
} </script>
</body>
</html>
正确点击按钮能拿到返回的经纬度
有个问题是： navigator.geolocation.getCurrentPosition(showPosition); 这个回调，有时有，有时没有 ，不稳定。 还有就是出来的经纬度弄到地图上，我了个去，跑到广州了。。。
--------------------------------------
本身百度地图api
ip定位： http://lbsyun.baidu.com/jsdemo.htm#i8_2 ， 有点糙，显示的是城市名
浏览器定位： http://lbsyun.baidu.com/jsdemo.htm#i8_1 ，拿到经纬度展示，大概的。
百度有个 Geolocation， 打开上面的2个中一个，替换下<script>代码如下，执行下
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12); var geolocation = new BMap.Geolocation(); //实例化浏览器定位对象。
//下面是getCurrentPosition方法。调用该对象的getCurrentPosition()，与HTML5不同的是，这个方法原型是getCurrentPosition(callback:function[, options: PositionOptions])，也就是说无论成功与否都执行回调函数1，第二个参数是关于位置的选项。 因此能否定位成功需要在回调函数1中自己判断。
geolocation.getCurrentPosition(function(r){ //定位结果对象会传递给r变量
if(this.getStatus() == BMAP_STATUS_SUCCESS){ //通过Geolocation类的getStatus()可以判断是否成功定位。
var mk = new BMap.Marker(r.point); //基于定位的这个点的点位创建marker
map.addOverlay(mk); //将marker作为覆盖物添加到map地图上
map.panTo(r.point); //将地图中心点移动到定位的这个点位置。注意是r.point而不是r对象。
alert('您的位置：'+r.point.lng+','+r.point.lat); //r对象的point属性也是一个对象，这个对象的lng属性表示经度，lat属性表示纬度。
}
else {
alert('failed'+this.getStatus());
}
},{enableHighAccuracy: true})
</script>
得到的是大致的经纬度，但城市是对的，位置有些偏差。
-----------------------------
这个功能上，高德地图api更好一些 ，误差很小。
自定义定位图标： http://lbs.amap.com/api/javascript-api/example/location/custom-location-icon
浏览器定位：http://lbs.amap.com/api/javascript-api/example/location/browser-location
/***************************************
由于Chrome、IOS10等已不再支持非安全域的浏览器定位请求，为保证定位成功率和精度，请尽快升级您的站点到HTTPS。
***************************************/
很准的说， 需要升级 https
根据HTML5 获取当前位置的经纬度【百度地图】【高德地图】的更多相关文章
- 使用html5获取当前手机的经纬度，并接入百度地图API，查询出当前位置
最近项目需要,稍微研究一下html5获取当前地理位置的问题. 获取当前位置的经纬度很简单,一句代码就搞定 navigator.geolocation.getCurrentPosition(functi ...
- Android中通过GPS或NetWork获取当前位置的经纬度
今天在Android项目中要实现一个通过GPS或NetWork来获取当前移动终端设备的经纬度功能.要实现该功能要用到Android Framework 中的 LocationManager 类.下面我 ...
- leaflet中如何优雅的解决百度、高德地图的偏移问题
话不多说,先上效果图 以前在做项目时,经常会听到客户说,你们这个地图是哪来的,太丑了,能不能换成百度地图--高德也行-- 大家生活中,基本上都已经习惯了使用百度地图和高德地图,而在做项目时,用这两个地 ...
- html5定位获取当前位置并在百度地图上显示
用html5的地理定位功能通过手机定位获取当前位置并在地图上居中显示出来,下面是百度地图API的使用过程,有需要的朋友可以参考下 在开发移动端 web 或者webapp时,使用百度地图 API 的过程 ...
- vue 单纯的获取经纬度 百度与高德 H5
首先用百度的api举个例子 首先在index页面引入如下: <script type="text/javascript" src="http://api.map.b ...
- js 如何在浏览器中获取当前位置的经纬度
这个有一定的误差哈,具体的误差是多少,有兴趣的朋友可以去测试下 直接上代码 index.html页面代码: <html> <head lang="en"> ...
- UWP Windows10开发获取设备位置（经纬度）
1.首先要在UWP项目的Package.appxmanifest文件中配置位置权限,如下图所示: 2.Package.appxmanifest后选择第三个选项卡,勾选位置权限(Location) 打开 ...
- Uwp Windows10获取设备位置（经纬度）
先在Package.appxmanifest中配置位置权限 2. 创建LocationManager类 using System; using System.Collections.Generic; ...
- iOS判断并使用百度地图 高德地图 导航 （使用URI，不集成sdk）
[objc] view plaincopy 1. BOOL hasBaiduMap = NO; 2. BOOL hasGaodeMap = NO; 3. ...
随机推荐
- SparkSQL开窗函数 row_number()
开始编写我们的统计逻辑,使用row_number()函数 先说明一下,row_number()开窗函数的作用 其实就是给每个分组的数据,按照其排序顺序,打上一个分组内行号 比如说,有一个分组20151 ...
- MySQL数据库的账户管理
账户管理 在生产环境下操作数据库时,绝对不可以使用root账户连接,而是创建特定的账户,授予这个账户特定的操作权限,然后连接进行操作,主要的操作就是数据的crud MySQL账户体系:根据账户所具有的 ...
- Unity脚本生命周期与执行顺序
文章目录 脚本生命周期 MonoBehavior生命周期图 脚本执行顺序 自定义执行顺序 在Unity中,脚本可以理解为附加在游戏对象上的用于定义游戏对象行为的指令代码.必须绑定在游戏对象上才能开始它 ...
- python科学计算与可视化
一.Numpy 库 NumPy(Numerical Python) 是 Python 语言的一个扩展程序库,支持大量的维度数组与矩阵运算,此外也针对数组运算提供大量的数学函数库. 引用: import ...
- 一种很有意思的数据结构：Bitmap
昨晚遇到了一种很有意思的数据结构,Bitmap. Bitmap,准确来说是基于位的映射.其中每个元素均为布尔型(0 or 1),初始均为 false(0).位图可以动态地表示由一组无符号整数构成的集合 ...
- Scala 中使用 akka system 的 scheduler 的例子
这是在scala控制台直接执行的例子. import akka.actor._ import scala.concurrent.duration._ import scala.concurrent ...
- docker with devicemapper storage driver
storage driver的选择依据很多的条件,比如发行版版本,团队技术积累,稳定性等. device mapper是redhat/centos中最适合的, 稳定性也可以,内核原生支持,基于块设备, ...
- Python爬虫之XML
一.请求参数形式为xml 举例说明. 现在有这样一个网址:https://www.runff.com/html/live/s1484.html:想要查询图片列表,打开F12,观察到请求如下: 这里的请 ...
- Win10 VS2015 静态编译Qt5.6.2源码
由于VS2015需要CRT等拓展组件,因此把内部编写的工具软件以静态发布,固需要编译Qt源码.Qt5.6.2版本,VS2015,Win10 1.安装python,perl,下载jom 2.改文件com ...
- InnoDB的后台线程(IO线程,master线程,锁监控线程,错误监控线程)和内存(缓冲池,重做日志缓冲池,额外内存池)
InnoDB有多个内存块,你可以认为这些内存块组成了一个大的内存池,负责如下工作: 维护所有进程/线程需要访问的多个内部数据结构. 缓存磁盘上的数据,方便快速地读取,并且在对磁盘文件的数据进行修改之前 ...