如何用按钮打开所有infoWIndows

感谢Mayur Patel，我能够在我的地图中添加关闭所有infoWindows的按钮。

现在我想添加打开所有引脚弹出窗口的按钮 – infoWindows。 所以我添加了函数openAllInfoWindows并添加了infoWindows[i].open(); 命令，但它不起作用。

HTML代码：

 Close Open 

地图代码：

 var markers = [  ]; var infoWindows = []; // for close button var mapOptions = { center: new google.maps.LatLng(markers[0].lat, markers[0].lng), zoom: , mapTypeId: google.maps.MapTypeId.ROADMAP // HYBRID }; var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); window.onload = function () { var infoWindow = new google.maps.InfoWindow(); var lat_lng = new Array(); var latlngbounds = new google.maps.LatLngBounds(); for (i = 0; i < markers.length; i++) { var data = markers[i] var myLatlng = new google.maps.LatLng(data.lat, data.lng); lat_lng.push(myLatlng); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: data.title }); latlngbounds.extend(marker.position); // open popup by click (function (marker, data) { google.maps.event.addListener(marker, "click", function (e) { infoWindow.setContent(data.description); infoWindow.open(map, marker); }); })(marker, data); // // Open all popups var infowindow = new google.maps.InfoWindow({ content: '
' +'
' + data.description + '
' + '
', maxWidth: 350 }); infowindow.open(map, marker); // //add infowindow to array (for close button) infoWindows.push(infowindow); } map.setCenter(latlngbounds.getCenter()); //Initialize the Path Array var path = new google.maps.MVCArray(); //Initialize the Direction Service var service = new google.maps.DirectionsService(); //Set the Path Stroke Color var poly = new google.maps.Polyline({ map: map, strokeColor: '#4986E7' }); } function closeAllInfoWindows() { for (var i=0;i<infoWindows.length;i++) { if (infoWindows[i]) infoWindows[i].close(); } } function openAllInfoWindows() { for (var i=0;i<infoWindows.length;i++) { if (infoWindows[i]) infoWindows[i].open(); } } 

Answer 1

@Roi我正在使用我以前的答案。

您需要全局地图对象和标记列表以使用按钮显示所有信息窗口。

步骤：请注意infoWindows将保留所有信息和标记。

 //Store all marker and infowindow in JSON array... var dict_map = {}; dict_map['infoWinObj'] = infowindow; dict_map['markerObj'] = marker; //push JSON dict in array infoWindows.push(dict_map); 

点击按钮打开所有信息窗口。

 Open all infowindows function openAllInfoWindows() { for (var i=0;i 

完整代码包括打开和关闭所有信息窗口：

  var markers = [  ]; var infoWindows = []; var mapOptions = { center: new google.maps.LatLng(markers[0].lat, markers[0].lng), zoom: , mapTypeId: google.maps.MapTypeId.ROADMAP // HYBRID }; var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); window.onload = function () { var infoWindow = new google.maps.InfoWindow(); var lat_lng = new Array(); var latlngbounds = new google.maps.LatLngBounds(); for (i = 0; i < markers.length; i++) { var data = markers[i] var myLatlng = new google.maps.LatLng(data.lat, data.lng); lat_lng.push(myLatlng); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: data.title }); latlngbounds.extend(marker.position); // open popup by click (function (marker, data) { google.maps.event.addListener(marker, "click", function (e) { infoWindow.setContent(data.description); infoWindow.open(map, marker); }); })(marker, data); // // Open all popups var infowindow = new google.maps.InfoWindow({ content: data.description }); google.maps.event.addListener(marker, 'mouseover', function () { infowindow.open(map, marker); }); infowindow.open(map, marker); //Store all marker and infowindow in JSON array... var dict_map = {}; dict_map['infoWinObj'] = infowindow; dict_map['markerObj'] = marker; //push JSON dict in array infoWindows.push(dict_map); // } map.setCenter(latlngbounds.getCenter()); // map.fitBounds(latlngbounds); //***********ROUTING****************// //Initialize the Path Array var path = new google.maps.MVCArray(); //Initialize the Direction Service var service = new google.maps.DirectionsService(); //Set the Path Stroke Color var poly = new google.maps.Polyline({ map: map, strokeColor: '#4986E7' }); } function closeAllInfoWindows() { for (var i=0;i 

Answer 2

infoWindow[i].open()接受一个或两个参数，你需要用你在代码中使用的相同参数调用它（ infowindow.open(map, marker); ）或者调用google.maps.event.trigger(marker, 'click')每个标记上。

无论哪种方式，您都需要保留对所有标记的引用。

 function openAllInfoWindows() { for (var i = 0; i < gmarkers.length; i++) { google.maps.event.trigger(gmarkers[i], "click"); } } 

（其中gmarkers是google.maps.Marker对象的数组）

概念certificate小提琴

（请注意，标记点击侦听器function中存在拼写错误）

代码段：

 var markers = [{ lat: 37.4419, lng: -122.1419, description: "Palo Alto" }, { lat: 37.4529598, lng: -122.1817252, description: "Menlo Park" }]; var gmarkers = []; // for open button var infoWindows = []; // for close button var mapOptions = { center: new google.maps.LatLng(markers[0].lat, markers[0].lng), zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP // HYBRID }; window.onload = function() { var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); var infoWindow = new google.maps.InfoWindow(); var lat_lng = new Array(); var latlngbounds = new google.maps.LatLngBounds(); for (i = 0; i < markers.length; i++) { var data = markers[i] var myLatlng = new google.maps.LatLng(data.lat, data.lng); lat_lng.push(myLatlng); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: data.title }); gmarkers.push(marker); latlngbounds.extend(marker.position); // Open all popups var infowindow = new google.maps.InfoWindow({ content: '
' + '
' + data.description + '
' + '
', maxWidth: 350 }); infowindow.open(map, marker); // open popup by click google.maps.event.addListener(marker, "click", (function(marker, infowindow, data) { return function(e) { infowindow.setContent(data.description); infowindow.open(map, marker); } })(marker, infowindow, data)); //add infowindow to array (for close button) infoWindows.push(infowindow); } map.setCenter(latlngbounds.getCenter()); //Initialize the Path Array var path = new google.maps.MVCArray(); //Initialize the Direction Service var service = new google.maps.DirectionsService(); //Set the Path Stroke Color var poly = new google.maps.Polyline({ map: map, strokeColor: '#4986E7' }); } function closeAllInfoWindows() { for (var i = 0; i < infoWindows.length; i++) { if (infoWindows[i]) infoWindows[i].close(); } } function openAllInfoWindows() { for (var i = 0; i < gmarkers.length; i++) { google.maps.event.trigger(gmarkers[i], "click"); } } 

 html, body, #map-canvas { height: 100%; width: 100%; margin: 0px; padding: 0px } 

  Close Open