html 高德地图坐标,百度地图,高德地图,HTML5经纬度比较
对于一个地点的经纬度,是确定的?这个问题,我想很多人都会回答,肯定了,可实际上呢?我只能呵呵了。
在使用百度地图的过程中,发现一个很奇怪的现象,有时候调用百度地图js API时,后得到一个错的离谱的地方。然后我自己也就研究了一下jsAPI获取地理位置的相关信息,jsAPI其实都是利用了HTML5中的方法获取地理信息的。但很奇怪,使用HTML5获取到的经纬度和百度获取的竟然相差很大。
HTML5获取到的经纬度
functiongetLocation() {
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
}
else{alert("Geolocation is not supported by this browser.") }
}
functionshowPosition(position)
{
$("#lngl").val(position.coords.longitude );
$("#latl").val(position.coords.latitude);
}
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
}
else {alert( "Geolocation is not supported by this browser.") }
}
function showPosition(position)
{
$("#lngl").val(position.coords.longitude );
$("#latl").val(position.coords.latitude);
}
百度地图获取经纬度的方法
// 百度地图API功能
varmap =newBMap.Map("allmap");
varcircle =newBMap.Geolocation();
varoptions={};
options.enableHighAccuracy=true;
options.timeout=10;
options.maximumAge=0;
circle.getCurrentPosition(locationResult, options); //enableHighAccuracy Boolean 要求浏览器获取最佳结果。,timeout Number 超时时间。,maximumAge Number 允许返回指定时间内的缓存结果。如果此值为0,则浏览器将立即获取新定位结果。
map.addOverlay(circle);
vartempGeocoder =newBMap.Geocoder();
functionlocationResult(geolocationResult) {
varStatus =this.getStatus()
if(Status == 0)//检索成功。对应数值“0”。
{
$("#lngBaidu").val(geolocationResult.point.lng);
$("#latBaidu").val(geolocationResult.point.lat);
varaddress = geolocationResult.address;
$("#cityBaidu").val(address.city);
$("#districtBaidu").val(address.district);
$("#streetBaidu").val(address.street);
else{
alert("定位失败错误码"+ Status)
}
}
// 百度地图API功能
var map = new BMap.Map("allmap");
var circle = new BMap.Geolocation();
var options={};
options.enableHighAccuracy=true;
options.timeout=10;
options.maximumAge=0;
circle.getCurrentPosition(locationResult, options); //enableHighAccuracyBoolean要求浏览器获取最佳结果。,timeoutNumber超时时间。,maximumAgeNumber允许返回指定时间内的缓存结果。如果此值为0,则浏览器将立即获取新定位结果。
map.addOverlay(circle);
var tempGeocoder = new BMap.Geocoder();
function locationResult(geolocationResult) {
var Status = this.getStatus()
if (Status == 0)//检索成功。对应数值“0”。
{
$("#lngBaidu").val(geolocationResult.point.lng);
$("#latBaidu").val(geolocationResult.point.lat);
var address = geolocationResult.address;
$("#cityBaidu").val(address.city);
$("#districtBaidu").val(address.district);
$("#streetBaidu").val(address.street);
else {
alert("定位失败错误码" + Status)
}
}高德地图获取经纬的方法
// 高德地图API功能
varmapObj, geolocation;
varMGeocoder;
mapObj = newAMap.Map('allmap1');
mapObj.plugin('AMap.Geolocation',function() {
geolocation = newAMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位,默认:true
timeout: 10000, //超过10秒后停止定位,默认:无穷大
maximumAge: 0, //定位结果缓存0毫秒,默认:0
convert: false,//自动偏移坐标,偏移后的坐标为高德坐标,默认:true
showButton: false,//显示定位按钮,默认:true
buttonPosition: 'LB',//定位按钮停靠位置,默认:'LB',左下角
buttonOffset: newAMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
showMarker: false,//定位成功后在定位到的位置显示点标记,默认:true
showCircle: false,//定位成功后用圆圈表示定位精度范围,默认:true
panToLocation: true,//定位成功后将定位到的位置作为地图中心点,默认:true
zoomToAccuracy: true//定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false
});
mapObj.addControl(geolocation);
AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
AMap.event.addListener(geolocation, 'error', onError);//返回定位出错信息
geolocation.getCurrentPosition();
});
functiononComplete(data) {
varlnglatXY = [data.position.getLng(), data.position.getLat()];
$("#accuracy").val(data.accuracy);
$("#lng").val(data.position.getLng());
$("#lat").val(data.position.getLat());
}
functiononError(data) {
varstr ='定位失败;';
str += '错误信息:'
switch(data.info) {
case'PERMISSION_DENIED':
str += '浏览器阻止了定位操作';
break;
case'POSITION_UNAVAILBLE':
str += '无法获得当前位置';
break;
case'TIMEOUT':
str += '定位超时';
break;
default:
str += '未知错误';
break;
}
alert(str);
}
// 高德地图API功能
var mapObj, geolocation;
var MGeocoder;
mapObj = new AMap.Map('allmap1');
mapObj.plugin('AMap.Geolocation', function () {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true, //是否使用高精度定位,默认:true
timeout: 10000, //超过10秒后停止定位,默认:无穷大
maximumAge: 0, //定位结果缓存0毫秒,默认:0
convert: false, //自动偏移坐标,偏移后的坐标为高德坐标,默认:true
showButton: false, //显示定位按钮,默认:true
buttonPosition: 'LB', //定位按钮停靠位置,默认:'LB',左下角
buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
showMarker: false, //定位成功后在定位到的位置显示点标记,默认:true
showCircle: false, //定位成功后用圆圈表示定位精度范围,默认:true
panToLocation: true, //定位成功后将定位到的位置作为地图中心点,默认:true
zoomToAccuracy: true //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false
});
mapObj.addControl(geolocation);
AMap.event.addListener(geolocation, 'complete', onComplete); //返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息
geolocation.getCurrentPosition();
});
function onComplete(data) {
var lnglatXY = [data.position.getLng(), data.position.getLat()];
$("#accuracy").val(data.accuracy);
$("#lng").val(data.position.getLng());
$("#lat").val(data.position.getLat());
}
function onError(data) {
var str = '定位失败;';
str += '错误信息:'
switch (data.info) {
case 'PERMISSION_DENIED':
str += '浏览器阻止了定位操作';
break;
case 'POSITION_UNAVAILBLE':
str += '无法获得当前位置';
break;
case 'TIMEOUT':
str += '定位超时';
break;
default:
str += '未知错误';
break;
}
alert(str);
}
使用这三种方法获取的经纬度竟然有很大不同!!
小数点后第一位就有可能不一样了,小数点后第二位是肯定不一样的,0.01的偏差就会导致几十公里的偏差,测试多次依然是这样。
最后在百度地图的官方文档找到了这样的的话
百度地图坐标转换API是一套以HTTP形式提供的坐标转换接口,用于将常用的非百度坐标(目前支持GPS设备获取的坐标、google地图坐标、soso地图坐标、amap地图坐标、mapbar地图坐标)转换成百度地图中使用的坐标,并可将转化后的坐标在百度地图JavaScript API、车联网API、静态图API、web服务API等产品中使用。注意Android SDK、iOS SDK、定位SDK和导航SDK坐标转换服务需单独申请
才知道HTML5得到的数据是需要转化之后才是百度地图的经纬度。难怪测试了很多次,几乎都有这么大的偏差。
HTML5经纬度转化为百度地图经纬度的方法:
varggPoint =newBMap.Point(position.coords.longitude, position.coords.latitude);//HTML5的经纬度
varconvertor =newBMap.Convertor();
varpointArr = [];
pointArr.push(ggPoint);
convertor.translate(pointArr, 1, 5, translateCallback)
}
//坐标转换完之后的回调函数
translateCallback = function(data) {
if(data.status === 0) {
// data.points[0];
//转换后的百度坐标(正确)
$("#lngz").val(data.points[0].lng);
$("#latz").val(data.points[0].lat);
}
}
var ggPoint = new BMap.Point(position.coords.longitude, position.coords.latitude);//HTML5的经纬度
var convertor = new BMap.Convertor();
var pointArr = [];
pointArr.push(ggPoint);
convertor.translate(pointArr, 1, 5, translateCallback)
}
//坐标转换完之后的回调函数
translateCallback = function (data) {
if (data.status === 0) {
// data.points[0];
//转换后的百度坐标(正确)
$("#lngz").val(data.points[0].lng);
$("#latz").val(data.points[0].lat);
}
}
经过这么转化后,偏差基本上在小数点后前三位基本上都一样了。
经过测试发现,高德地图似乎直接使用了HTML5返回的经纬度,但没找到相关的文档,百度地图使用的是转化过的经纬度。一个简单的经纬度问题却由于各种原因导致了这么一个背离常识的问题,实在是令人难以理解!!
html 高德地图坐标,百度地图,高德地图,HTML5经纬度比较相关推荐
- ios html调起高德地图,iOS开发笔记 调起本地地图导航(百度、高德、腾讯、苹果自带)...
地图 从自己的APP跳转到用户本地的APP进行导航.首先,要先查看用户都安装了哪些地图类APP. 下面分3种情况进行分析: 1.用户没有安装第三方的地图,只有苹果自带的地图应用. 2.用户安装一款第三 ...
- 国内地图坐标系介绍及常见地图(百度、高德、凯立德)之间的坐标系转换
一.国内地图坐标系简介 1. WGS84(地图坐标) 美国GPS使用的是WGS84的坐标系统.GPS系统获得的坐标系统,基本为标准的国际通用的WGS84坐标系统 2. GCJ-02(火星坐标) G ...
- (0039) iOS 开发之地图之百度vs高德
项目中需要集成地图的一些功能.实现定位(锚点和气泡支持自定义)和画多段线的功能. 于是就集成两大常用地图SDK(高德(阿里旗下)和百度).根据过程,记录自己的对比认识. 两者文档:高德目录清晰,内容更 ...
- android 高德地图 sh1,百度、高德地图获取发布版(Release)SHA1
一.简介: 在百度.高德地图开发中,申请key的时候,要两个版本的sha1值.一个是开发版(debug),一个是发布版(release). debug版本的sha1比较好获取,网上资料一堆,这里引用一 ...
- java百度地图坐标_java腾讯地图与百度地图坐标转换
/** * 坐标转换,腾讯地图转换成百度地图坐标 * @param lat 腾讯纬度 * @param lon 腾讯经度 * @return 返回结果:经度,纬度 */ public String m ...
- android gps 火星坐标,GPS真实坐标与火星地图坐标/百度地图坐标的转换
#include #include #include static const uint32_t GPSBaud = 9600; TinyGPSPlus gps; HardwareSerial ss( ...
- SLAM无人车计算地图坐标,ros中计算地图坐标,rosweb计算画布对应的坐标(含代码,含公式,超详细),开发跨系统地图导航必备算法【可实现qt,android,c#,mfc,html等地图开发】
ros中计算地图坐标,rosweb计算画布对应的坐标 视频讲解: SLAM无人车计算地图坐标,图片像素坐标公式推导 1.订阅话题 /map nav_msgs::OccupancyGrid 这个消息中可 ...
- vue 使用高德地图标记坐标,去除高德水印logo
第一步:找到项目里的index.html引入 <script type="text/javascript" src="https://webapi.amap.com ...
- 关于各种地图(百度、高德等等)的坐标类型以及相互转换
bd09ll 表示百度经纬度坐标, gcj02 表示经过国测局加密的坐标, wgs84 表示gps获取的坐标. 其中最坑的是百度的坐标,百度坐标在原有的基础上自己做了一层加密,也就是bd09 ...
最新文章
- 【C语言刷题】交换两个变量(包含不创建临时变量)的解法
- 为什么品牌商纷纷搭建自己的商城小程序?
- php 模板使用,在PHP中使用模板的方法
- 获取浏览器窗口_全面认识区块链浏览器--看穿币圈的蒙蔽与欺骗!
- python中json格式数据输出实现方式(无unicode编码输出形式)
- 面向对象编程——获取对象信息(五)
- TortoiseSVN 加锁,服务器地址更换,切换登录用户
- c语言综合作业答案,C语言作业答案
- sniffer的高级工具
- python字符串的删除操作_学习快人一步|python中常见的27个字符串操作
- 国都企信通短信平台发送手机短信的python脚本一例
- Qt QSettings读写ini时 General 读不出来值
- Install Tcpping on Linux
- matlab中GUI界面的一些设计与操作
- ps4 DNS服务器未响应,【网络dns设置教程】ps4网络设置教程 dns
- 2017年数据库技术盘点
- word段落每行首字怎么对齐_怎样使word文章段落乖乖对齐!一个设置就行!
- 线上点餐APP开发基本功能
- 使用Jetpack Compose竟能做出如此漂亮的倒计时APP
- html添加一条虚线垂直的,【html问题】在网页中添加垂直分割线