百度地图批量顺序转换经纬度防止顺序错位

来源：互联网发布：linux grub命令行编辑：程序博客网时间：2024/05/18 00:35

今天玩玩百度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(); // 继承OverlayRectangleOverlay.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

此记！

阅读全文

0 0