百度地图之批量转换成百度坐标

最新推荐文章于 2023-08-23 13:34:04 发布

tom_tom_tom_xiang

最新推荐文章于 2023-08-23 13:34:04 发布

阅读量576

点赞数

CC 4.0 BY-SA版权

分类专栏：百度地图文章标签：百度地图转坐标

本文链接：https://blog.youkuaiyun.com/tom_tom_tom_xiang/article/details/77187895

百度地图专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种使用百度地图API批量转换GPS坐标为百度坐标的方法，并通过实例演示了如何处理超过10个坐标的转换限制，同时展示了如何在地图上绘制路径。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题描述：本来将GPS坐标转换成百度坐标很简单，有官方的Demo。可是官方的Demo上没说，最多支持一次转换10个，一次多于10个，将不会转换，解决的代码如下：

<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{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
		#allmap{height:500px;width:100%;}
		#r-result{width:100%; font-size:14px;}
	</style>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak="></script>
	<script type="text/javascript" src="arrow.js"></script>  
	<title>Line To Markers</title>
</head>
<body>
	<div id="allmap"></div>
	<div id="r-result">
		
	</div>
</body>
</html>
<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	var a = 117.103949;
	var b = 36.656588;
	map.centerAndZoom(new BMap.Point(122.263053,29.726606),14);
	map.enableScrollWheelZoom(true);
	
	var pl = [{weight:2,color:"blue",opacity:0.6,points:["122.251285|29.733870","122.25734|29.745576","122.26043|29.731436","122.256262|29.728614","122.257418|29.7253407","122.257783|29.722075","122.2649623|29.720381","122.2645623|29.710381","122.2644623|29.700381","122.2643623|29.690381","122.2642623|29.680381","122.2641623|29.670381","122.2640623|29.660381","122.2645623|29.650381","122.2755623|29.652481"]}  
    ];  
	
	map.clearOverlays(); 
	addPolyline(pl);
	//向地图中添加线函数  
    function addPolyline(plPoints){  
        for(var i=0;i<plPoints.length;i++){  
            var json = plPoints[i];  
            var points = [];
            for(var j=0;j<json.points.length;j++){  
                var p1 = json.points[j].split("|")[0];  
                var p2 = json.points[j].split("|")[1];  
                points.push(new BMap.Point(p1,p2));
				var marker = new BMap.Marker(new BMap.Point(p1,p2));  // 创建标注
				createMarkers(j,marker);
				map.addOverlay(marker);  
            }  
            var line = new BMap.Polyline(points,{strokeWeight:json.weight,strokeColor:json.color,strokeOpacity:json.opacity}); 
            map.addOverlay(line);     
        }  
    }
	
	var total = 0; //总记录数
    var groupCount = 0; //每次转十条
	var ps = pl[0].points;
    if (ps.length % 10 > 0) {
        groupCount = (ps.length / 10) ;
    }
    else {
        groupCount = 1;
    }
	var dataPoints = new Array();
    for(var i=0;i<groupCount;i++){ //外层循环，有多少组十条
        var pos = new Array();
        for(var j=0;j<10;j++){ //内层循环，每组十条
            if(total<ps.length){ //不超过总记录数结束
                var point = new BMap.Point(ps[total].split("|")[0],ps[total].split("|")[1]);
                pos.push(point);
            }
            total++;
        }
        var convertor = new BMap.Convertor();
        convertor.translate(pos, 1, 5, function(data){
            if(data.status === 0) {
				for (var i = 0; i < data.points.length; i++) { 
					dataPoints.push(data.points[i]); 	
                }   			
              }
        });
	
    }
	function createMarkers(j,marker){
		if(j == 0){
				var label = new BMap.Label("起点",{offset:new BMap.Size(0,0)});  
					label.setStyle({  
						color : "green",  
						fontSize : "10px",  
						height : "15px",  
						lineHeight : "15px",  
						backgroundColor:"rgba(255, 255, 255, 0.8) none repeat scroll 0 0 !important",//设置背景色透明  
						border:"1px solid blue"  
					}); 
			}else if(j == pl[0].points.length - 1){
				var label = new BMap.Label("终点");  
					label.setStyle({  
						color : "red",  
						fontSize : "10px",  
						height : "15px",  
						lineHeight : "15px",  
						backgroundColor:"rgba(255, 255, 255, 0.8) none repeat scroll 0 0 !important",//设置背景色透明  
						border:"1px solid blue"  
					});

			}else{
				var label = new BMap.Label("经过点"+(j));  
					label.setStyle({  
						color : "blue",  
						fontSize : "10px",  
						height : "15px",  
						lineHeight : "15px",  
						backgroundColor:"rgba(255, 255, 255, 0.8) none repeat scroll 0 0 !important",//设置背景色透明  
						border:"1px solid blue"  
					});  
				}
				marker.setLabel(label); 

	}
	//init();
	function init(){
		for (var i = 0; i < dataPoints.length; i++) {
			 var marker = new BMap.Marker(dataPoints[i]);
			 createMarkers(i,marker);
			 map.addOverlay(marker);
		}
		var line = new BMap.Polyline(dataPoints,{strokeWeight:2,strokeColor:"blue",strokeOpacity:0.6});                      
		map.addOverlay(line); 
	}
	setTimeout(init,1000);
	
</script>

注意：要将你的ak复制进去，不要用老版本的API。

为了对比方便以及更加好看，将生成的标注点，用线进行了连接。欢迎大家，留言讨论！

快乐学习，快乐编程！