百度地圖API五:大批量多次座標轉換結果返回順序問題

原創

liusaint1992

2020-02-21 18:24

前段時間發現採集到的GPS數據轉換成百度座標系後，地圖上的位置偏差非常大。一查是要經過一個轉換程序把gps座標轉換爲百度座標。
這裏查看百度自己的座標轉換的接口說明以及演示。
http://lbsyun.baidu.com/index.php?title=webapi/guide/changeposition
http://developer.baidu.com/map/jsdemo.htm#a5_3

可以看到，這個百度的座標轉換是必須在線轉換的。類似通過ajax把你的座標傳遞到百度的服務器，然後百度再把轉換後的座標發過來。

我們傳遞初始座標系，目標座標系，以及要轉換的點的數據，百度轉換後將經裏返回到我們的回調函數中去。

如果我們要轉換的點非常的多的話，我們就只有把我們的座標大數組分成幾組分幾次來調用接口來轉換。我們的每一個請求返回的時間不是固定的，可能後請求的卻先返回。如何保證我們所有的座標轉換之後的結果是原始大數組一一對應的順序呢。我們如何知道返回的結果是第幾組請求的結果呢。

如果服務器是我們自己的，我們當然有的是辦法。可惜不是。

首先想到的是遞歸。查完一組之後在回調函數中進行下一組的查詢。不過這樣的話可能會有某一組請求不成功的時候會影響到後面的座標的轉換的風險。

然後決定從回調函數中來想辦法。

我的實現方式把回調函數定義到一個閉包裏，閉包裏保存了這是第幾組請求，然後回調函數可以訪問到這是第幾組請求。於是就可以在回調函數裏求出來本次返回的數據是我們原始大數組中的第幾個數據的轉換結果。從而保證返回結果的有序性。

最後在回調函數中清理一下內存。callback = null。

核心代碼：

</pre><pre name="code" class="javascript">	function AddOver(){
		var len = oriPoints.length;
		var points = [];//將大數組分成小數組存放。
		var ajaxId = 0;//第幾組請求
		var i = 0 ;
		var j = 0 ;
		var ajaxLen =0;//要發起幾次請求。

		//數組分裝
		for (; i < len; i++) {	
			if(i%gap == 0){
				ajaxId = Math.floor(i/gap);
				points[ajaxId] = [];
			}
			points[ajaxId].push(oriPoints[i]);	
		}

		ajaxLen = points.length;
		//閉包和回調。
		for (; j < ajaxLen; j++) {
			(function() {
				var jj = j;
				//回調函數，添加marker。
				var callback = function(data){
					var ajaxId = jj; 
					var len = oriPoints.length,i,maker,label,theIcon; 
					var base = ajaxId * gap; //本數組在原始大數組中的起始位。
					if(data.status === 0) {
						var dateLen = data.points.length; 
						for(i=0;i <dateLen;i++){
							if(oriPoints[base+i].status != 1){
								theIcon = icon_off; 
							}else{
								theIcon = icon_on; 
							} 
							marker = new BMap.Marker(data.points[i],{icon:theIcon}); 
							label = new BMap.Label(oriPoints[base+i].name,{offset:new BMap.Size(20,0)}); 
							marker.setLabel(label); 
							map.addOverlay(marker); 
							markers[base+i]=marker; 
							endPoints[base+i]=data.points[i];
							if(oriPoints.length == endPoints.length){//加載完畢。
								map.setViewport(endPoints);//設置中心點
							}
						}
					}
					callback = null;//清理內存。
					jj = null;
				}
				posTrans(points[j],callback);//座標轉換新的數據圖標添加到地圖上。
			})();		
		}

	}

//座標轉換
	function posTrans(points,callback){
		var BdPoints = [],len = points.length,i;
		for (i = 0; i < len; i++) {
			BdPoints.push(new BMap.Point(points[i].lng,points[i].lat))
		}
		var convertor = new BMap.Convertor();
		convertor.translate(BdPoints, 1, 5, callback);//百度的座標轉換接口。
	}

至於爲什麼要保證有序。

我們可以看到百度轉換後返回的座標是隻有座標數據而沒有一個標註點我們需要的別的數據的。而這些數據只有從原始大數組中去讀取。

所以保持了原始大數組與結果大數組的一一對應，我們就可以讀取到每一個i對應的座標信息之外的數據了。比如點名。

效果圖：