解决百度地图中心偏移到左上角

Posted 2021-01-19 zhangzhiqin

订单中心点左上角位置，网上查了很多资料，说是在div在隐藏的状态下创建BMap会出现这种情况，此时，默认为宽度和高度都为0，中心点自然就跑到左上角去了，网上很多说了很多解决方案，map.centerAndZoom(point,15);            map.setCenter(point);                 查看百度API还有panTo();等等一些方法，还是没有解决问题，最终在API里面事件里找到了：地图加载完毕的事件，等地图加载完毕，在这个事件里在将地图的中心点设置成自己想要的点,这样会存在一个问题，就是如果设置的中心点是固定的点，那么每次拖动地图的时候最后的中心点都会在设置的固定点上，也就是会出现拖拽后又返回的的情况，像是有弹力般的感觉，这是就需要在js里定义一个变量，只让这个事件作用一次，就是指在第一次加载该地图页面的时候用该事件设置一次中心点,这样就完美解决该问题：

var jd = response.getParameter("jd");
var wd = response.getParameter("wd");
// 创建Map实例
var map = new BMap.Map("container");
// 创建地图实例
var point = new BMap.Point(jd, wd);
// var point = new BMap.Point(jd, wd);
// 创建点坐标
map.centerAndZoom(point,15);
// 初始化地图，设置中心点坐标和地图级别
var marker = new BMap.Marker(point); // 创建标注
map.addOverlay(marker);

map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.ScaleControl());
map.addControl(new BMap.OverviewMapControl());
var loadCount = 1;
    map.addEventListener("tilesloaded",function(){
        if(loadCount == 1){
            map.setCenter(point);
        }       
loadCount = loadCount + 1;
   });