我正在创建一个web应用程序,它有两个Google实例:一个有多个点,另一个只有一点。
它们似乎相互冲突,因为当我先看一页时,另一张地图的中心位置就不对了。
首页:

第二页:

下面是我的项目的链接:http://jakeserver.com/Apps/BostonLandmarks/B12/index.html
下面是生成Google地图的代码:
var detailsMap = new google.maps.Map(document.getElementById("map_" + this.id), {
zoom: 10,
center: new google.maps.LatLng(landmarkList[rowCount].landmarkGPSNorth, landmarkList[rowCount].landmarkGPSWest),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var detailsInfoWindow = new google.maps.InfoWindow();
var detailsMarker, j;
detailsMarker = new google.maps.Marker({
position: new google.maps.LatLng(landmarksArray[rowCount].landmarkGPSNorth, landmarksArray[rowCount].landmarkGPSWest),
map: detailsMap,
icon: "Icons/red-pin.pdf"
});
detailsInfoWindow.setContent(landmarksArray[rowCount].landmarkName);
detailsInfoWindow.open(detailsMap, detailsMarker);
google.maps.event.addListener(detailsMarker, 'click', (function(detailsMarker, j) {
return function() {
detailsInfoWindow.open(detailsMap, detailsMarker);
}
})(detailsMarker, j));
}
document.getElementById("map_" + this.id).style.height = 300 + "px";
document.getElementById("map_" + this.id).style.width = 300 + "px";有什么想法吗?
发布于 2014-08-06 17:21:55
很久以前,我在一个网站中使用基于Ajax的导航时遇到了类似的问题,每个页面都有一张地图,第一个页面正常工作,但是下一个页面有相同的问题。
在显示地图之前,您应该创建一个新的绑定对象。就像这样:
var bounds = new google.maps.LatLngBounds();在那之后。你必须扩大边界,通过你的标志位置。如下所示:
bounds.extend(marker.position);最后,当地图实际上是可见的和呈现的时候。运行以下行。
google.maps.event.trigger(secondMapInstance, 'resize');
secondMapInstance.fitBounds(bounds);https://stackoverflow.com/questions/25166019
复制相似问题