Javascript 谷歌地图Api-通过类别导航隐藏所有信息窗口

我构建了一个导航，可以在谷歌地图上显示/隐藏不同的标记类别。每个标记在单击时显示一个信息窗口。如果单击标记类别，我想关闭打开的信息窗口。我曾尝试过这个解决方案，但无法成功。我有一个切换功能：

//toggle visibility of Marker Categories
function toggleGroup(type, elem, infoWindow, map) {
  for (var i = 0; i < markerGroups[type].length; i++) {
    // alert(markerGroups[type][i]);
    var marker = markerGroups[type][i];
    if (!marker.getVisible()) {
      marker.setVisible(true);
      elem.classList.add('active');
    } else {
      marker.setVisible(false);
      elem.classList.remove('active');
    }
  }
}

//切换标记类别的可见性
功能切换组（类型、元素、信息窗口、映射）{
对于（var i=0；i

---

fiddle:

如果您想在

toggleGroup

函数中访问信息窗口，则需要将其传递给函数，而在单击事件中不需要这样做（函数包含四个参数，只传递两个）：

一个选项是使map和infoWindow全局化，并在调用

toggleGroup

函数时将其关闭

//toggle visibility of Marker Categories
function toggleGroup(type, elem) {
  infoWindow.close();
  // ...

代码片段：

//全局变量
var infoWindow=new google.maps.infoWindow（）；
var映射；
//切换标记类别的可见性
功能切换组（类型，元素）{
//关闭信息窗口
infoWindow.close（）；
对于（var i=0；i“+地址+”
“；
var icon=customIcons[type]| |{}；
var marker=new google.maps.marker({
地图：地图，
位置:点,，
图标：icon.icon
});
MarkerGroup[类型]。推送（标记）；
bindInfoWindow（标记、地图、infoWindow、html）；
}
// });
映射边界（bounds）；
//打印dat地图！
var printMaps=函数（）{
变量body=$（'body'），
mapContainer=$（“#map”），
mapContainerParent=mapContainer.parent（），
printContainer=$（''）；
正文.前置（打印容器）；
印刷容器
.addClass（“打印容器”）
.css（'位置'，'相对'）
.height（'body.height（）'））
.append（映射容器）；
var content=body.children（）
.not（'脚本'）
.not（打印容器）
.detach（）；
window.print（）；
正文.前置（内容）；
mapContainerParent.prepend（mapContainer）；
printContainer.remove（）；
};
$（'.map print'）。在（'click'，printmap'）上；
//关闭初始化
}
//单击功能标记，打开信息窗口
函数bindInfoWindow（标记、地图、infoWindow、html）{
google.maps.event.addListener（标记'click'，函数（）{
setContent（html）；
信息窗口。打开（地图、标记）；
});
}
google.maps.event.addDomListener（窗口“加载”，加载）；
//主多边形-定义多边形路径的板条坐标。
var triangleCoords=[{
拉脱维亚：48.130723，
液化天然气：11.536538
}, {
拉脱维亚：48.130466，
液化天然气：11.536259
}, {
拉脱维亚：48.129191，
液化天然气：11.538692
}, {
拉脱维亚：48.130265，
液化天然气：11.538976
}, {
拉脱维亚：48.130265，
液化天然气：11.538402
}, {
拉脱维亚：48.130602，
液化天然气：11.538402
}, {
拉脱维亚：48.131114，
液化天然气：11.537206
}, {
拉脱维亚：48.130659，
液化天然气：11.536755
}];
//获取XML的数据
函数parseXml（str）{
if（window.ActiveXObject）{
var doc=新的ActiveXObject（'MicrosoftXMLDOM'）；
doc.loadXML（str）；
退货单；
}else if（window.DOMParser）{
return（新的DOMParser）.parseFromString（str，'text/xml'）；
}
}
var xmlStr=''；
var markerGroups={
“家”：[]，
“酒吧”：[]，
“酒店”：[]，
“餐厅”：[]，
“购物”：[]，
“freizeit”：[]，
“文化”：[]
};
var customIcons={
主页：{
图标：'http://maps.google.com/mapfiles/ms/micons/blue.png'
},
酒吧：{
图标：'http://maps.google.com/mapfiles/ms/micons/green.png'
},
酒店：{
图标：'http://maps.google.com/mapfiles/ms/micons/orange.png'
},
餐厅：{
图标：'http://maps.google.com/mapfiles/ms/micons/red.png'
},
购物：{
图标：'http://maps.google.com/mapfiles/ms/micons/yellow.png'
},
弗雷泽特：{
图标：'http://maps.google.com/mapfiles/ms/micons/purple.png'
},
文化：{
图标：'http://maps.google.com/mapfiles/ms/micons/grey.png'
}
};
//创建单个贴图样式的数组。
变量样式=[{
“特色类型”：“景观。人造”，
“elementType”：“geometry.stroke”，
“造型师”：[{
“颜色”：“000000”
}]
}, {
“featureType”：“administration.locality”，
“elementType”：“全部”，
“造型师”：[{
“可见性”：“打开”
}, {
“色调”：“2c2e33”
}, {
“饱和”：7
}, {
“莱特尼斯
//toggle visibility of Marker Categories
function toggleGroup(type, elem) {
  infoWindow.close();
  // ...