當發生中心進行偏移到左上角的時候，我們要知道為什么會發生這個問題
原因就是模態框在沒有彈出的時候，即隱藏狀態下，地圖api會默認為寬高為0，所以他的初始寬高為0，因此中心點不管取什么值都會在左上角
解決方案：
我們首先要了解一個地圖api的事件：tilesloaded
這個事件的作用就是當地圖所有圖塊加載完成時才會觸發，每次拖動地圖也會觸發tilesloaded事件
所以我們可以在地圖完全加載之后再次重新初始化生成地圖，代碼如下：
注意：事件里面的代碼是完整的初始化生成地圖的代碼
var map = new BMap.Map('map_canvas');
map.addEventListener("tilesloaded",function () {
var map = new BMap.Map('map_canvas');
map.enableScrollWheelZoom();
// console.log(PointArr)
var p = Math.ceil(PointArr.length / 2);
map.centerAndZoom(new BMap.Point(PointArr[p].x, PointArr[p].y), 15);
var driving;
for(var i in PointArr){
if(i == 0 ){
addMarker(new BMap.Point(PointArr[i].x, PointArr[i].y),"起點");
continue;
}
driving = new BMap.DrivingRoute(map, {renderOptions:{map: map, autoViewport: false},
onMarkersSet:function(routes) {
map.removeOverlay(routes[0].marker); //刪除API自帶起點
map.removeOverlay(routes[1].marker); //刪除API自帶終點
}});
driving.search(new BMap.Point(PointArr[i-1].x, PointArr[i-1].y),
new BMap.Point(PointArr[i].x, PointArr[i].y));
if(i == PointArr.length -1){
addMarker(new BMap.Point(PointArr[i].x, PointArr[i].y),"終點");
}
}
/**
* 標記
* @param {Object} point
*/
function addMarker(point,name){
var marker = new BMap.Marker(point);
var label = new BMap.Label(name, {
offset : new BMap.Size(20, -10)
});
marker.setLabel(label);
map.addOverlay(marker);
}
})
map.enableScrollWheelZoom();
// console.log(PointArr)
var p = Math.ceil(PointArr.length / 2);
map.centerAndZoom(new BMap.Point(PointArr[p].x, PointArr[p].y), 15);
var driving;
for(var i in PointArr){
if(i == 0 ){
addMarker(new BMap.Point(PointArr[i].x, PointArr[i].y),"起點");
continue;
}
driving = new BMap.DrivingRoute(map, {renderOptions:{map: map, autoViewport: false},
onMarkersSet:function(routes) {
map.removeOverlay(routes[0].marker); //刪除API自帶起點
map.removeOverlay(routes[1].marker); //刪除API自帶終點
}});
driving.search(new BMap.Point(PointArr[i-1].x, PointArr[i-1].y),
new BMap.Point(PointArr[i].x, PointArr[i].y));
if(i == PointArr.length -1){
addMarker(new BMap.Point(PointArr[i].x, PointArr[i].y),"終點");
}
}
/**
* 標記
* @param {Object} point
*/
function addMarker(point,name){
var marker = new BMap.Marker(point);
var label = new BMap.Label(name, {
offset : new BMap.Size(20, -10)
});
marker.setLabel(label);
map.addOverlay(marker);
}