我需要在Google地图上只打开一个InfoWindow。在打开新的InfoWindows之前,我需要关闭所有其他InfoWindows。
有人可以告诉我该怎么做吗?
答案 0 :(得分:150)
您只需创建一个InfoWindow
对象,保留对它的引用,并对所有标记重复使用if。 Quoting from the Google Maps API Docs:
如果您只想一次显示一个信息窗口(就像Google地图上的行为一样),您只需要创建一个信息窗口,您可以在地图事件(例如用户点击)上重新分配到不同的位置或标记)。
因此,您可能只想在初始化地图后创建InfoWindow
对象,然后按如下方式处理标记的click
事件处理程序。假设您有一个名为someMarker
的标记:
google.maps.event.addListener(someMarker, 'click', function() {
infowindow.setContent('Hello World');
infowindow.open(map, this);
});
然后InfoWindow
会在您点击新标记时自动关闭,而无需调用close()
方法。
答案 1 :(得分:29)
创建您的infowindow超出范围,以便您可以共享它。
这是一个简单的例子:
var markers = [AnArrayOfMarkers];
var infowindow = new google.maps.InfoWindow();
for (var i = 0, marker; marker = markers[i]; i++) {
google.maps.event.addListener(marker, 'click', function(e) {
infowindow.setContent('Marker position: ' + this.getPosition());
infowindow.open(map, this);
});
}
答案 2 :(得分:12)
我遇到了同样的问题,但最好的答案并没有完全解决,我在for声明中所要做的就是使用与当前标记相关的内容。也许这有助于某人。
for(var i = 0; i < markers.length; i++){
name = markers[i].getAttribute("name");
address = markers[i].getAttribute("address");
point = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
contentString = '<div style="font-family: Lucida Grande, Arial, sans-serif;>'+'<div><b>'+ name +'</b></div>'+'<div>'+ address +'</div>';
marker = new google.maps.Marker({
map: map,
position: point,
title: name+" "+address,
buborek: contentString
});
google.maps.event.addListener(marker, 'click', function(){
infowindow.setContent(this.buborek);
infowindow.open(map,this);
});
marker.setMap(map);
}
答案 3 :(得分:4)
晚了一点,但我设法只有一个infowindow由maken infowindow打开一个全局变量。
var infowindow = new google.maps.InfoWindow({});
然后在listner中
infowindow.close();
infowindow = new google.maps.InfoWindow({
content: '<h1>'+arrondissement+'</h1>'+ gemeentesFiltered
});
infowindow.open(map, this);
答案 4 :(得分:4)
声明全局var selectedInfoWindow;
并使用它来保存打开的信息窗口:
var infoWindow = new google.maps.InfoWindow({
content: content
});
// Open the infowindow on marker click
google.maps.event.addListener(marker, "click", function() {
//Check if there some info window selected and if is opened then close it
if (selectedInfoWindow != null && selectedInfoWindow.getMap() != null) {
selectedInfoWindow.close();
//If the clicked window is the selected window, deselect it and return
if (selectedInfoWindow == infoWindow) {
selectedInfoWindow = null;
return;
}
}
//If arrive here, that mean you should open the new info window
//because is different from the selected
selectedInfoWindow = infoWindow;
selectedInfoWindow.open(map, marker);
});
答案 5 :(得分:0)
当您处理新标记上的点击事件时,您需要跟踪以前的InfoWindow对象并在其上调用 close 方法。< / p>
N.B 没有必要在共享信息窗口对象上调用close,使用其他标记调用open会自动关闭原始对象。有关详细信息,请参阅Daniel's answer。
答案 6 :(得分:0)
基本上你想要一个能够引用一个new InfoBox()
=&gt;的函数。委托onclick事件。
在创建标记时(在循环中)使用bindInfoBox(xhr, map, marker);
// @param(project): xhr : data for infoBox template
// @param(map): object : google.maps.map
// @param(marker): object : google.maps.marker
bindInfoBox: (function () {
var options = $.extend({}, cfg.infoBoxOptions, { pixelOffset: new google.maps.Size(-450, -30) }),
infoBox = new window.InfoBox(options);
return function (project, map, marker) {
var tpl = renderTemplate(project, cfg.infoBoxTpl); // similar to Mustache, Handlebars
google.maps.event.addListener(marker, 'click', function () {
infoBox.setContent(tpl);
infoBox.open(map, marker);
});
};
}())
var infoBox
被异步分配并保存在内存中。每次调用bindInfoBox()
时,都会调用返回函数。也很方便只传递infoBoxOptions
一次!
在我的示例中,我必须向map
添加一个额外的参数,因为我的初始化被标签事件延迟。
答案 7 :(得分:0)
使用 jQuery 执行此操作的一种智能简单方法如下:
google.maps.event.addListener(marker, 'click', function (e) {
jQuery(".gm-ui-hover-effect").click();
marker.info.open(map, this);
});
它会点击工具提示中的所有关闭按钮。
答案 8 :(得分:-1)
解决这个问题:
function window(content){
google.maps.event.addListener(marker,'click', (function(){
infowindow.close();
infowindow = new google.maps.InfoWindow({
content: content
});
infowindow.open(map, this);
}))
}
window(contentHtml);
答案 9 :(得分:-4)
Google地图允许您只打开一个信息窗口。因此,如果您打开一个新窗口,则另一个窗口会自动关闭。