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

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

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

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

实现代码：

 //在百度 map中显示地址

     var map = new BMap.Map("map_canvas");

     var point = new BMap.Point(longitudeP , latitudeP);  // 创建点坐标

     map.centerAndZoom(point, 15);// 初始化地图，设置中心点坐标和地图级别

     var marker = new BMap.Marker(point);

     map.addOverlay(marker);

     BMap.Convertor.translate(point,0,translateCallback);     //真实经纬度转成百度坐标

回调函数代码：

 //坐标转换完之后的回调函数

 function translateCallback(point1){

     var marker1 = new BMap.Marker(point1);

     map.addOverlay(marker1);

     var label = new BMap.Label("转换后的百度坐标",{offset:new BMap.Size(20,-10)});

     marker1.setLabel(label); //添加百度label

     map.setCenter(point1);

 }

这是新的效果图:

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

关于这个demo：

在线查看demo

demo代码：

 <!DOCTYPE html>

 <html>

 <head>

 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>GIS开发利用html5获取经纬度并在百度地图中查看</title>

 <!--加载百度 map api-->

 <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=8827ee39511568ac0705d037d67b2624"></script>

 <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>

 </head>

 <body>

 <span id="support">将下面的经纬度输入谷歌地图：</span>

 <div id="show">

 纬度：<span id="latitude"></span><br />

 经度：<span id="longitude"></span><br />

 准确度：<span id="accuracy"></span>

 </div>

 <div id="map_canvas" style="width:500px; height:500px;"></div>

 <script type="text/javascript">

 var doc = document,

     latitude = doc.getElementById('latitude'),

     longitude = doc.getElementById('longitude'),

     accuracy = doc.getElementById('accuracy'),

     support = doc.getElementById('support'),

     showDiv = doc.getElementById('show');

 var map = new BMap.Map("map_canvas");

 function lodeSupport(){

     if(navigator.geolocation){

         support.innerHTML = '将下面的经纬度输入谷歌地图(纬度 经度)查看自己位置：';

         showDiv.style.display = 'block';

         navigator.geolocation.getCurrentPosition(updataPosition);

     }else{

         support.innerHTML = '对不起，浏览器不支持！';

         showDiv.style.display = 'none';

     }

 }

 function updataPosition(position){

     var latitudeP = position.coords.latitude,

         longitudeP = position.coords.longitude,

         accuracyP = position.coords.accuracy;

     latitude.innerHTML = latitudeP;

     longitude.innerHTML = longitudeP;

     accuracy.innerHTML = accuracyP;

     //在百度 map中显示地址

     var point = new BMap.Point(longitudeP , latitudeP);  // 创建点坐标

     map.centerAndZoom(point, 15);// 初始化地图，设置中心点坐标和地图级别

     var marker = new BMap.Marker(point);

     map.addOverlay(marker);

     BMap.Convertor.translate(point,0,translateCallback);     //真实经纬度转成百度坐标

 }

 //坐标转换完之后的回调函数

 function translateCallback(point1){

     var marker1 = new BMap.Marker(point1);

     map.addOverlay(marker1);

     var label = new BMap.Label("转换后的百度坐标",{offset:new BMap.Size(20,-10)});

     marker1.setLabel(label); //添加百度label

     map.setCenter(point1);

 }

 window.addEventListener('load', lodeSupport , true);

 </script>

 </body>

 </html>

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

关于百度地图API的地图坐标转换问题的更多相关文章

  1. ***微信LBS地理位置开发+百度地图API(地理位置和坐标转换)

    微信公众平台开发 - 获取用户地理位置 本文介绍在微信公众平台上如何使用高级接口开发获取用户地理位置的功能. 一.获取用户地理位置接口 开通了上报地理位置接口的公众号,用户在关注后进入公众号会话时,会 ...

  2. 百度地图API自定义地图

    http://api.map.baidu.com/lbsapi/creatmap/index.html http://developer.baidu.com/map/index.php?title=w ...

  3. 网页嵌入百度地图和使用百度地图api自定义地图的详细步骤

    在网页中插入百度地图 如果想在自己的网页上面加入百度地图的话,可以用百度地图的api.具体使用方法如下: 第一步:进入百度创建地图的网站http://api.map.baidu.com/lbsapi/ ...

  4. 百度地图API地理位置和坐标转换

    1.由地名(省份.城市.街道等)得到其对应的百度地图坐标: http://api.map.baidu.com/geocoder/v2/?output=json&ak=你从百度申请到的Key&a ...

  5. 百度地图api根据地图缩放等级显示不同的marker点，功能二

    功能一里面有marker点后台的代码 根据地图的缩放等级显示不同marker点的坐标JSP代码 <%@ page language="java" contentType=&q ...

  6. HTML5结合百度地图API创建地图应用

    具体的百度地图API的使用方法查看百度地图API里的DEMO <style> #div1{ width:400px; height:400px; border:1px #000 solid ...

  7. js调用百度地图API创建地图，搜索位置

    实现代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <met ...

  8. JavaScript对接百度地图api实现地图标点功能

    粗略的做了个地图标点功能 首先,去百度注册开发者账号,然后进入到百度地图开放平台 进入到控制台, 创建浏览器端应用,给个安全域名 然后去开发者文档JavaScript里面找地图展示文档,直接怼上去就行 ...

  9. 百度地图API实现地图定位

    1.引用JS: <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0& ...

随机推荐

  1. this 函数内部属性

    前言:在javascript中我们会经常碰到this,然后this经常出现在function方法里面,有时候可能因为代码很多,无法判断this指向的是谁,其实很简单,一句话总结:谁点出这个this,这 ...

  2. kettle中Get Data from XML , Jason Input , 文本文件输入 使用示例

    1.Get Data from XML xml文件内容: <head> <img id="1">菜||焦溜丸子||2013-03-28/image/0/00 ...

  3. HTTP和HTTPS详解

    http://blog.csdn.net/mingli198611/article/details/8055261/ 转自:http://www.cnblogs.com/ok-lanyan/archi ...

  4. Appium Android 屏幕滑动

  5. cocos2d-x实战 C++卷 学习笔记--第7章 动作、特效（一）

    前言: 介绍cocos2d-x中的动作.特效. 动作: 动作(action)包括基本动作和基本动作的组合,这些基本动作有缩放.移动.旋转等,而且这些动作变化的速度也可以设定. 动作类是 Action. ...

  6. 第七篇、hitTest UITabbar中间突出按钮额外增加可点击区域

    简介: 以前UITabbar使用中间有一个凸起按钮时,常常就需要用到hitTest来处理可点击的范围. 示例代码: - (UIView *)hitTest:(CGPoint)point withEve ...

  7. dorado需要的包

    创建dorado示例中心项目WEB-INF下的lib里的包有很多,包括连接数据库的完整的包,新建的项目,可以直接从这里面拷贝包. 当然如果需要连接mySql数据库,还需要手动导入mySql的包.

  8. android开发 单击按钮 实现页面间的跳转

    我的MainActivity.java部分代码 public class MainActivity extends ActionBarActivity { //不要定义button类型,会出错 Vie ...

  9. cannot convert from '_TCHAR *' to 'char *'

    Reference: Why can't convert TCHAR* to char* Need to Use Multi-Byte Character Set in project's setti ...

  10. bat文件的妙用1-一键开启所有开发软件

    每天早上来的第一件事情,就是打开电脑,然后开一堆的软件 1.wamp 开发环境 2.钉钉   通讯工具 3.PHPstrom 开发工具 4.nodejs.bat Nodejs的扩展(node D:/w ...