百度地图应用之将google坐标转成百度坐标

最新推荐文章于 2022-01-06 17:41:53 发布

nacky_

最新推荐文章于 2022-01-06 17:41:53 发布

阅读量829

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/naiqihe/article/details/52988186

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
    </style>
   
    <title>百度地图应用之将google坐标转成百度坐标</title>
</head> 
<body>
    <div id="allmap"></div>




</body>
 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
</html>
<script type="text/javascript">
var allmap = document.getElementById("allmap");
allmap.style.cssText = "width: 500px;height:600px";//设置地图的宽高
var bm = new BMap.Map("allmap"); //地图初始化
//longitude:经度   latitude:纬度   name:名字 isGoogleCoordinate：是否为谷歌坐标
function showMarker(longitude, latitude, name,isGoogleCoordinate) {
    // 百度地图API功能
    //谷歌坐标
    var x = longitude;
    var y = latitude;
    var ggPoint = new BMap.Point(x,y);
    //地图初始化
    bm.centerAndZoom(ggPoint, 17);
     //坐标转换完之后的回调函数
    translateCallback = function (data){
      if(data.status === 0) {
        var marker = new BMap.Marker(data.points[0]);
        bm.addOverlay(marker);
        var label = new BMap.Label(name,{offset:new BMap.Size(20,-10)});
        marker.setLabel(label); //添加百度label
        bm.centerAndZoom(data.points[0], 17);
      
      }
    }
if(isGoogleCoordinate){//如果是谷歌坐标，则调用convertor.translate()进行转换并调用回调函数
        var convertor = new BMap.Convertor();
        var pointArr = [];
        pointArr.push(ggPoint);
        convertor.translate(pointArr, 3, 5, translateCallback);
}else{//非谷歌坐标则不需要转换
  //添加谷歌marker和label
  var markergg = new BMap.Marker(ggPoint);
  bm.addOverlay(markergg); //添加谷歌marker
  var labelgg = new BMap.Label(name,{offset:new BMap.Size(20,-10)});
  markergg.setLabel(labelgg); //添加谷歌label
  bm.centerAndZoom(ggPoint, 17);
    }
  
}
 var longitude = 116.32715863448607;
 var latitude = 39.990912172420714;
 var name = "北京";
 var isGoogleCoordinate = true;
 showMarker(longitude,latitude,name,isGoogleCoordinate);//调用
</script>

注：如果不设置地图的宽和高可能会出现无法将坐标定位到显示的中心位置。所需密钥可以通过访问http://lbsyun.baidu.com/apiconsole/key申请获得