最近的專案裡有功能模組需要實現地圖顯示,用的是高德地圖.前不久發現個小問題,專案需要實現點選某個Marker時將地圖放大到合適的級別,中心點設定為當前Marker的座標,並顯示一個InfoWindow;問題所在就是當點選該Marker的時候,經常無法將地圖中心設定為當前Marker的座標,導致Marker跑偏了十萬八千里,視野內的地圖空無一物..相當的不友好…..
之前實現這個功能的程式碼如下:

var infoWindow = new AMap.InfoWindow({offset: new AMap.Pixel(0, -15),autoMove:true});
infoWindow.setContent
 
(marker.content);
infoWindow.open(map, marker.getPosition());
map.setZoomAndCenter(map.getZoom()>13?map.getZoom():14,marker.getPosition());//設定地圖放大級別及居中

解決方法如下:

var infoWindow = new AMap.InfoWindow({offset: new AMap.Pixel(0, -15),autoMove:true});
infoWindow.setContent(marker.content);
setTimeout(function(){
        infoWindow.open
 
(map, marker.getPosition());
    },400);
map.setZoomAndCenter(map.getZoom()>13?map.getZoom():14,marker.getPosition());//設定地圖放大級別及居中

猜測原因在於InfoWindow的open方法,官方API只給出了這個方法需要兩個引數,map物件以及指定座標.這裡要吐槽一下高德的API,做地圖的時候要啥啥沒有= =
至於具體是啥原因其實還沒找到,如果哪位大師知道是啥原因的還望指點
解決方法就是在js里加個setTimeout方法,待地圖中心點被設定為Marker的座標後再執行Infowindow的open方法,這樣就能解決以上出現的問題
延遲400毫秒完美解決