高德地图Marker与InfoWindow定位居中冲突问题

最近的项目里有功能模块需要实现地图显示,用的是高德地图.前不久发现个小问题,项目需要实现点击某个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毫秒完美解决

 

你可能感兴趣的:(javascript)