今天玩玩百度mapAPI，想起來一個4年前沒能力解決的問題：標註物的經緯度顯示偏差，API有提供轉換功能，但是試了一下，單個和批量都不能解決我的問題，而且批量時還有10個上限的限制，先放到迴圈中，一次轉換一個，結果回撥函式工作非同步，導致經緯度和其他JSON資料錯位，看到有人用定時器來解決，但沒具體程式碼，試了一下，定時器放在轉換函式同層，發現還是有問題，定時太短的話，依然會導致前面的JSON資料被後來的覆蓋，而定時太長的話，幾百個點，要轉到何時？ 最終想起將定時器激發放到回撥函式裡面，這樣就可以轉完一個再轉下一個，終於完美解決問題，實現了“同步”，而且定時可設為1毫秒。

var markerArr = [
{
	"name":"A城",
	"AQI":"84",
	"index":"良",
	"point":"106.5|28.4",
	"Num":"2"
},
{
	"name":"B街",
	"AQI":"97",
	"index":"良",
	"point":"106.4|27.3",
	"Num":"2"
},
{
	"name":"C和",
	"AQI":"87",
	"index":"良",
	"point":"106|27",
	"Num":"2"
}]

//--------自定義圖層設定
RectangleOverlay.prototype = new BMap.Overlay(); // 繼承Overlay
RectangleOverlay.prototype.initialize = function(map) {
	this._map = map;
	this._overlayEl = document.createElement('div');
	this._overlayEl.className = this._className;
	this._overlayEl.style.zIndex = BMap.Overlay.getZIndex(this._mapPoint.lat); 
	this._labelEl = document.createElement('span');
	this._labelEl.className = this._className + '-label';
	this._labelEl.appendChild(document.createTextNode(this._label));
	this._overlayEl.appendChild(this._labelEl);
	this._map.getPanes().labelPane.appendChild(this._overlayEl);
	return this._overlayEl;
};
RectangleOverlay.prototype.draw = function() {
	var pixel = this._map.pointToOverlayPixel(this._mapPoint);
	// 計算矩形偏移
	var style = window.getComputedStyle(this._overlayEl);
	var overlayHeight = parseInt(style.height, 10);
	this._overlayEl.style.left = pixel.x + 'px';
	this._overlayEl.style.top = (pixel.y - overlayHeight) + 'px';
}; 
 
function RectangleOverlay(mapPoint, label, className) {
	this._mapPoint = mapPoint;
	this._label = label;
	this._className = className;
}    
     
//建立marker // 測試展現自定義覆蓋物		
var i=0;
var t;
console.log('markerArr.length:'+markerArr.length);
function addlay(){
	console.log('A:'+i);			
	var jsona = markerArr[i];
	var lj = jsona.point.split("|")[0];
	var lw = jsona.point.split("|")[1];
	var mapPoint = new BMap.Point(lj,lw);
	var pointArr = [];
	pointArr.push(mapPoint); 
	//座標轉換完之後的回撥函式			
	translateCallback= function (data){
		if(data.status === 0) {					
			mapPoint=data.points[0];					
			console.log('T:'+i);
			var json = markerArr[i];
			var iconImg = json.Num;
			var rectangleOverlay = new RectangleOverlay(mapPoint, json.name+" AQI:"+json.AQI+" "+json.index, 'point'+iconImg+'-overlay');
			map.addOverlay(rectangleOverlay);	
			i++;
			if(i<markerArr.length){t=setTimeout("addlay()",1)}//陣列沒完繼續執行下一陣列元素，否則終止。
			//因回撥函式為上一步操作完成才呼叫，因此將setTimeout() 方法放在回撥函式內部，意為：轉換完成才執行下一步操作
			console.log('D:'+i);
		}		
	}             
	var convertor = new BMap.Convertor();
	console.log('B:'+i);
	convertor.translate(pointArr, 1, 5, translateCallback);	
	console.log('C:'+i);	
}
addlay();
 

此記！