前段时间做的项目前端都是用Google地图,最近在一个地方需要用到百度地图,因为不同地图都有自己的处理,同一个经纬度在不同地图上显示的位置并不相同,因此,要把以前的数据直接拿过来用需要做一个转换。查阅百度地图的js API之后发现有直接从google到baidu的转换api,不错啊,于是自己做了两个实例来记录一下,以后再用到也可以看看。

首先,转换api大致有两种,一个是单点转换,一个是批量坐标转换(好像一次能转换20个点左右,具体没深入查看),这里写了两个js程序,详见下面两个实例的部分代码:先加上相应的js库,

  1. <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=3140E164A92ec6884b61b080e7bd973a"></script>
  2. <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/changeMore.js"></script>

(1)单点转换

  1. /**
  2. *  从数据库中获取到一条路线上100个点的经纬度坐标(google地图下的数据),经过百度地图api转换之后,正常显示在百度地图上。
  3. */
  4. var result = new Array();
  5. var pointArray = new Array();
  6. var num =0;
  7. var sum=0;
  8. var map;
  9. $(document).ready(function(){
  10. $("#pref").click(function(){
  11. if(top.showRouteMapPageSource=="route"){
  12. location.href = "/VehicleManagement/pageController/getRoute";
  13. }
  14. else{
  15. location.href="/VehicleManagement/pageController/addRouteStep4";
  16. }
  17. });
  18. map = new BMap.Map("allmap");
  19. map.enableScrollWheelZoom();
  20. pointArray=[];
  21. result=[];
  22. num = 0;
  23. //parent.stopIdArray中包含了一条路线上所有点的集合
  24. for(var i = 0;i<parent.stopIdArray.length;i++){
  25. var point = new BMap.Point(parent.stopLngArray[i],parent.stopLatArray[i]);
  26. pointArray.push(point);
  27. }
  28. sum=pointArray.length;//一条路线上点的总数
  29. makeLine(map);
  30. });
  31. function makeLine() {
  32. var gpsPoint=new BMap.Point(pointArray[num].lng, pointArray[num].lat);
  33. // google转化为百度经纬度
  34. BMap.Convertor.translate(gpsPoint,2,function (point){
  35. result.push(point);
  36. var marker = new BMap.Marker(result[num]); //创建marker
  37. map.addOverlay(marker);
  38. //一个个点转换的过程中记录已转换点的个数
  39. num++;
  40. if(num==sum){
  41. makepoly();  //在最后一次画线
  42. }else{
  43. makeLine();  //循环坐标转换,并不画线
  44. }
  45. });
  46. }
  47. function makepoly(){
  48. if(parent.stopIdArray.length%2==0){
  49. map.centerAndZoom(result[parent.stopIdArray.length/2], 14);
  50. }
  51. else{
  52. map.centerAndZoom(result[(parent.stopIdArray.length-1)/2], 14);
  53. }
  54. var polyline = new BMap.Polyline(result, {
  55. strokeColor : "blue",
  56. strokeWeight : 6,
  57. strokeOpacity : 0.5
  58. });
  59. map.addOverlay(polyline);
  60. }

(2 )批量转换

    1. /**
    2. *  将一条路线的站点信息显示在地图上  批量转换google到baidu地图
    3. */
    4. var result = new Array();
    5. var pointArrays = new Array();
    6. var num =0;
    7. var sum=0;
    8. var map;
    9. $(document).ready(function(){
    10. $("#pref").click(function(){
    11. if(top.showRouteMapPageSource=="route"){
    12. location.href = "/VehicleManagement/pageController/getRoute";
    13. }
    14. else{
    15. location.href="/VehicleManagement/pageController/addRouteStep4";
    16. }
    17. });
    18. map = new BMap.Map("allmap");
    19. map.enableScrollWheelZoom();
    20. pointArrays=[];
    21. result=[];
    22. num = 0;
    23. var groupNum = 0;
    24. var pointArray = new Array();
    25. //parent.stopIdArray中包含了一条路线上所有点的集合,此处将点击分组,20个一组,批量坐标转换,提高效率
    26. for(var i = 0;i<parent.stopIdArray.length;i++){
    27. if(groupNum<20){
    28. var point = new BMap.Point(parent.stopLngArray[i],parent.stopLatArray[i]);
    29. pointArray.push(point);//分成20个一组
    30. groupNum++;
    31. }else{
    32. sum++;
    33. pointArrays.push(pointArray);// 一个小组作为一个元素加入pointArrays,并将容器置空
    34. groupNum=0;
    35. pointArray=[];
    36. }
    37. }
    38. if(groupNum!=0){
    39. sum++;
    40. pointArrays.push(pointArray);//最后一组可能不足20个
    41. }
    42. count();//循环纠偏,并显示到地图上
    43. });
    44. //分组转换,每一组转换后的数据都加入到result中
    45. function count() {
    46. var gpsPoints=pointArrays[num];
    47. // google转化为百度经纬度(参数2,表示是从GCJ-02坐标到百度坐标。参数0,表示是从GPS到百度坐标)
    48. BMap.Convertor.transMore(gpsPoints,2,callback);
    49. }
    50. callback= function (points){
    51. var xyResult = null;
    52. for(var index in points){
    53. xyResult = points[index];
    54. if(xyResult.error != 0){continue;}//出错就直接返回;
    55. var point = new BMap.Point(xyResult.x, xyResult.y);
    56. result.push(point);
    57. }
    58. num++;//表示一组
    59. //              alert(num);
    60. if(num==sum){ //最后的时候执行一次
    61. makepoly();
    62. }else{
    63. count(); //循环坐标转换,批量
    64. }
    65. }
    66. function makepoly(){
    67. //  alert(result.length);
    68. //图标
    69. for(var i=0;i<result.length;i++){
    70. var marker = new BMap.Marker(result[i]); //创建marker
    71. map.addOverlay(marker);
    72. }
    73. //地图居中,放大级别,不设置会出问题的。。
    74. if(parent.stopIdArray.length%2==0){
    75. map.centerAndZoom(result[parent.stopIdArray.length/2], 14);
    76. }
    77. else{
    78. map.centerAndZoom(result[(parent.stopIdArray.length-1)/2], 14);
    79. }
    80. //画线
    81. var polyline = new BMap.Polyline(result, {
    82. strokeColor : "blue",
    83. strokeWeight : 6,
    84. strokeOpacity : 0.5
    85. });
    86. map.addOverlay(polyline);
    87. }

百度API实例——google地图数据转化为百度地图数据的更多相关文章

  1. 【转】百度API获取城市名地名(附源码)

    在做一个软件时,用到了定位功能.网上有很多关于google 的GPS定位,但网上关于google定位都没有用, 搜索下原因:(这里建议大家在中国就尽量不使用系统自带的定位) 因为Google的服务器不 ...

  2. 百度地图api 实例 自动提示 并计算两地的行驶距离

    百度地图api 实例 自动提示 并计算两地的行驶距离 <!DOCTYPE html> <html> <head> <meta http-equiv=" ...

  3. 【百度地图API】百度API卫星图使用方法和卫星图对比工具

    原文:[百度地图API]百度API卫星图使用方法和卫星图对比工具 百度地图API推出卫星图接口也有一个月啦~ 本文除了介绍如何使用百度地图API来操作卫星图外,还顺带制作了个卫星图对比工具. 一.百度 ...

  4. 百度地图热力图--批量地址转换应用(基于百度api)

    需求:把外卖订餐地址做个用户分布热力图 思路分析:第一步去百度地图api开放平台找例子 http://lbsyun.baidu.com/jsdemo.htm#c1_15 首先从百度API的demo例子 ...

  5. arcgis api for javascipt 加载天地图、百度地图

    写在前面的话: 1.百度地图是自己定义的坐标系统,wkid=102100.百度地图数据是加密的产物.下文将附上百度坐标与WGS84,谷歌等坐标系统转换方法(地理-地理),此方法并未亲测,据说准 2.百 ...

  6. 去百度API的百度地图准确叠加和坐标转换的解决方案研究

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 目前项目上如果要使用百度地图,得加载百度的开发包,然后通过百 ...

  7. C#+JQuery+.Ashx+百度Echarts实现全国省市地图和饼状图动态数据图形报表的统计

    在目前的一个项目中,需要用到报表表现数据,这些数据有多个维度,需要同时表现出来,同时可能会有大量数据呈现的需求,经过几轮挑选,最终选择了百度的echarts作为报表基础类库.echarts功能强大,界 ...

  8. seo之google rich-snippets丰富网页摘要结构化数据(微数据)实例代码

    seo之google rich-snippets丰富网页摘要结构化数据(微数据)实例代码 网页摘要是搜索引擎搜索结果下的几行字,用户能通过网页摘要迅速了解到网页的大概内容,传统的摘要是纯文字摘要,而结 ...

  9. Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图

      标签: Android百度地图API Key  分类: Android 百度地图开发(2)    最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地 ...

随机推荐

  1. c#获取MAC地址和IP地址

    一获取mac地址 1.先添加system.management的dll组件2.添加引用 public string GetMACAddress(){string MoAddress = "& ...

  2. django的model继承abstract,proxy,managed

    https://www.cnblogs.com/wangwei916797941/p/9525127.html?from=timeline

  3. 基于turtle库的七段数码管绘制

    ·文章结构 >样例及概览 >函数框架分析 >功能发展·样例及概览 七段数码管,是信号灯.电子表等很多设备的显示形式.而利用python的turtle库,我们也可以模拟着写出一个动态生 ...

  4. POJ 1789 Truck History (Kruskal)

    题目链接:POJ 1789 Description Advanced Cargo Movement, Ltd. uses trucks of different types. Some trucks ...

  5. (转)Adaboost

    基本原理 Adaboost算法基本原理就是将多个弱分类器(弱分类器一般选用单层决策树)进行合理的结合,使其成为一个强分类器. Adaboost采用迭代的思想,每次迭代只训练一个弱分类器,训练好的弱分类 ...

  6. JS轻松实现单击文本框弹出选择日期

    我的开发工具是vs2005,你们可选择自己合适的开发工具 首先创建个文本框<input id="txFDate" name="txFDate" type= ...

  7. input输入框数字转带千分位的字符串

    数字转带千分位的字符串 思路 先获取要转换的数字,对其进行分割 小数部分具体需要保留多少位,具体处理 整数部分用正则做替换 将小数部分和整数部分合计 代码 注意: 本文是基于 jQuery 写的,稍稍 ...

  8. SQLServer存储过程学习记录

    简单来说,存储过程就是一条或者多条sql语句的集合,可视为批处理文件,但是其作用不仅限于批处理. 一.存储过程的概述 SQL Server中的存储过程是使用T_SQL编写的代码段.它的目的在于能够方便 ...

  9. 2018-8-10-win10-uwp-json

    title author date CreateTime categories win10 uwp json lindexi 2018-08-10 19:16:53 +0800 2018-2-13 1 ...

  10. ubuntu18.4 搭建lamp环境

    一.Apache2 web服务器的安装: 可以先更新一下服务器(可选) 1.sudo apt update             # 获取最新资源包 2.sudo apt upgrade       ...