我喜欢跟踪我Google地图界面上打开的所有信息窗口(我将它们的名称存储在数组中),但是我无法弄清如何从数组中删除它们,当它们通过每个信息窗口右上角的“x”关闭时。
是否有一些回调函数可以监听?或者我可以做类似于
addListener("close", infowindow1, etc
的事情吗?
我喜欢跟踪我Google地图界面上打开的所有信息窗口(我将它们的名称存储在数组中),但是我无法弄清如何从数组中删除它们,当它们通过每个信息窗口右上角的“x”关闭时。
是否有一些回调函数可以监听?或者我可以做类似于
addListener("close", infowindow1, etc
的事情吗?
有一个名为closeclick
的事件可以帮助你关闭信息窗口。
var currentMark;
var infoWindow = new google.maps.InfoWindow({
content: 'im an info windows'
});
google.maps.event.addListener(marker, 'click', function () {
infoWindow.open(map, this);
currentMark = this;
});
google.maps.event.addListener(infoWindow,'closeclick',function(){
currentMark.setMap(null); //removes the marker
// then, remove the infowindows name from the array
});
在这里我找到的唯一稳定的解决方案是保留对 infoWindow
的指针,并在需要验证它是否已关闭时检查它的 .getMap()
方法。
原因是点击其他元素可能会导致 infoWindow 因其他原因被关闭,而不触发 closeclick
事件。
var infoWindow = new google.maps.InfoWindow({ content: 'Something to put here.' });
infoWindow.open(map, infoWindow);
setInterval(function ()
{
console.log("infoWindow is bound to map: "+(infoWindow.getMap() ? true : false));
}, 1000);
如果你只关心infoWindow
是否使用“X”按钮关闭,那么监视closeclick
就可以了。但是,还有其他原因可能导致它被关闭或已经关闭。
infoWindow.addListener('closeclick', ()=>{
// Handle focus manually.
});
var closeBtn = $('.gm-style-iw').next();
closeBtn.click(function(){
//other things you want to do when close btn is click
that.infowindow.close();
});
我重写了这个点击函数,因为在我改变它的CSS/位置后,在Safari中点击按钮无法工作。
简化并扩展最受欢迎的解决方案,您可以在处理标记单击事件时创建标记,让您同时打包由于x图标的closeclick
事件而导致其删除。
以下是一个示例,通过在标记上附加布尔值hasInfoWindow
状态来避免重复信息窗口创建。
newMarker.addListener('click', function () {
// If a marker does not yet have an info window, create and show it
if (newMarker['hasInfoWindow'] !== true) {
newInfoWindow = new google.maps.InfoWindow({content: infoContent});
mapSet['infoWindowsObj'].push(newInfoWindow);
newMarker['hasInfoWindow'] = true;
newInfoWindow.open(mapSet, newMarker);
// If info window is dismissed individually, fully remove object
google.maps.event.addListener(newInfoWindow, 'closeclick', function () {
newInfoWindow.setMap(null);
newMarker['hasInfoWindow'] = false;
mapSet['infoWindowsObj'].filter(arrayItem => arrayItem !== newInfoWindow);
});
}
});
如果您想通过地图上的点击事件删除所有打开的信息窗口,可以遍历 mapSet['infoWindowsObj']
的内容以完全删除每个信息窗口。
我相信这种行为让您可以在大多数情况下使用信息窗口,而无需像谷歌的 自定义弹出窗口示例 那样重新实现整个功能。
这很简单,找到关闭信息窗口按钮的类,即'.gm-ui-hover-effect'
触发关闭信息窗口
$('.gm-ui-hover-effect').trigger('click');