开发者社区> 杰克.陈> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

关于百度地图API的地图坐标转换问题

简介: 原文:关于百度地图API的地图坐标转换问题 我在之前的文章利用html5获取经纬度并且在百度地图中显示位置中使用了百度地图的API来显示html5获取的地理位置,在文中我说过这样的话,我说百度地图的准确度不怎么精确,偏差很大。
+关注继续查看
原文:关于百度地图API的地图坐标转换问题

我在之前的文章利用html5获取经纬度并且在百度地图中显示位置中使用了百度地图的API来显示html5获取的地理位置,在文中我说过这样的话,我说百度地图的准确度不怎么精确,偏差很大。这里我要更正下:

国际经纬度坐标标准为WGS-84,国内必须至少使用国测局制定的GCJ-02,对地理位置进行首次加密。百度坐标在此基础上,进行了BD-09二次加密措施,更加保护了个人隐私。百度对外接口的坐标系并不是GPS采集的真实经纬度,需要通过坐标转换接口进行转换。

由此可以看出小编之前冤枉了百度地图,所以如果对您有误导还请见谅。所以写了篇关于百度地图API坐标转换的文章,并且对之前的模型做了修正。

实现代码:

1 //在百度 map中显示地址
2     var map = new BMap.Map("map_canvas");
3     var point = new BMap.Point(longitudeP , latitudeP);  // 创建点坐标  
4     map.centerAndZoom(point, 15);// 初始化地图,设置中心点坐标和地图级别  
5     var marker = new BMap.Marker(point);    
6     map.addOverlay(marker); 
7     BMap.Convertor.translate(point,0,translateCallback);     //真实经纬度转成百度坐标

回调函数代码:

1 //坐标转换完之后的回调函数
2 function translateCallback(point1){
3     var marker1 = new BMap.Marker(point1);
4     map.addOverlay(marker1);
5     var label = new BMap.Label("转换后的百度坐标",{offset:new BMap.Size(20,-10)});
6     marker1.setLabel(label); //添加百度label
7     map.setCenter(point1);
8 }

这是新的效果图:

可以看出转换出的效果还是相当精确的,并且从我这里的demo来看要比谷歌地图精确的多!所以如果也有像我一样的用户发现调用baidu map坐标有偏差的话,很有可能就是没有进行坐标转换。

关于这个demo:

在线查看demo 

 

demo代码:

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
 6 <title>GIS开发利用html5获取经纬度并在百度地图中查看</title>
 7 <!--加载百度 map api-->
 8 <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=8827ee39511568ac0705d037d67b2624"></script>  
 9 <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
10 </head>
11 
12 <body>
13 <span id="support">将下面的经纬度输入谷歌地图:</span>
14 <div id="show">
15 纬度:<span id="latitude"></span><br />
16 经度:<span id="longitude"></span><br />
17 准确度:<span id="accuracy"></span>
18 </div>
19 <div id="map_canvas" style="width:500px; height:500px;"></div>
20 <script type="text/javascript">
21 var doc = document,
22     latitude = doc.getElementById('latitude'),
23     longitude = doc.getElementById('longitude'),
24     accuracy = doc.getElementById('accuracy'),
25     support = doc.getElementById('support'),
26     showDiv = doc.getElementById('show');
27 var map = new BMap.Map("map_canvas");
28 function lodeSupport(){
29     if(navigator.geolocation){
30         support.innerHTML = '将下面的经纬度输入谷歌地图(纬度 经度)查看自己位置:';
31         showDiv.style.display = 'block';
32         navigator.geolocation.getCurrentPosition(updataPosition);
33     }else{
34         support.innerHTML = '对不起,浏览器不支持!';
35         showDiv.style.display = 'none';
36     }
37 }
38 function updataPosition(position){
39     var latitudeP = position.coords.latitude,
40         longitudeP = position.coords.longitude,
41         accuracyP = position.coords.accuracy;
42     latitude.innerHTML = latitudeP;
43     longitude.innerHTML = longitudeP;
44     accuracy.innerHTML = accuracyP;
45     //在百度 map中显示地址
46     
47     var point = new BMap.Point(longitudeP , latitudeP);  // 创建点坐标  
48     map.centerAndZoom(point, 15);// 初始化地图,设置中心点坐标和地图级别  
49     var marker = new BMap.Marker(point);    
50     map.addOverlay(marker); 
51     BMap.Convertor.translate(point,0,translateCallback);     //真实经纬度转成百度坐标
52     
53 }
54 //坐标转换完之后的回调函数
55 function translateCallback(point1){
56     var marker1 = new BMap.Marker(point1);
57     map.addOverlay(marker1);
58     var label = new BMap.Label("转换后的百度坐标",{offset:new BMap.Size(20,-10)});
59     marker1.setLabel(label); //添加百度label
60     map.setCenter(point1);
61 }
62 
63 window.addEventListener('load', lodeSupport , true);
64 </script>
65 </body>
66 </html>

 

 转载自:http://malagis.com/baidu-maps-api-map-coordinate-conversion.html

 

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
JavaScript中尺寸、坐标
测试环境是IE8,Chrome38,Firefox40,下面是全局通用脚本打印代码
26 0
唯一坐标转换问题
现在有一个二维坐标组成的数组,例如 [[0,7],[8,10],[12,19],[13,15],[2,9],[19,22],[25,27],[30,33]]; 这些坐标可以按照以下规则进行转换,例如: 1.
987 0
【百度地图API】如何批量转换为百度经纬度
原文:【百度地图API】如何批量转换为百度经纬度 摘要:      百度地图API的官网上提供了常用坐标转换的示例。但是,一次只能转换一个,真的非常麻烦!!这里结合了官方的示例,自制一个批量转换工具,供大家参考。
1483 0
【高德地图API】从零开始学高德JS API(六)——坐标转换
原文:【高德地图API】从零开始学高德JS API(六)——坐标转换 摘要:如何从GPS转到谷歌?如何从百度转到高德?这些都是小case。我们还提供,如何将基站cell_id转换为GPS坐标? ----------------------------------------------------------------------------------------- 第一部分 各种坐标系详解 1、大地坐标系统 WGS-84 用来表述地球上点的位置的一种地区坐标系统。
2152 0
[unity3d]屏幕坐标跟世界坐标的转换
keep study very day!写写今天的学习收获,今天学习到了平面坐标跟世界坐标的相互转换。 效果:点击鼠标中键,创建一个小球,虽然看起来是屏面的,但实则是在三维空间里面创建的哦! 代码挂在摄像机上: using UnityEngine; using System.
641 0
+关注
杰克.陈
一个安静的程序猿~
10425
文章
2
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载