谷歌地图2 InfoWindows自动打开infoWindow，点击1 infoWindow后

Question

我有一个自动打开的infoWindow。

我希望只有两个是自动打开的，而一个没有。效果就像在照片里一样。我的守则：

<script>
function initialize() {
    var openedInfoWindow = [];
    var locations = [
        ['Oddział', 52.846190, 17.723237, 3],
        ['Oddział', 52.812224, 17.201023, 2],
        ['Zakład Poligraficzny - Siedziba', 52.847942, 17.757889, 1]       
    ];
    var cityCircle;
    var map = new google.maps.Map(document.getElementById('map-canvas'), {
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoomControl: true,
          zoomControlOptions: {
            style: google.maps.ZoomControlStyle.SMALL
          }

    });

   var bounds = new google.maps.LatLngBounds();

    for (i = 0; i < locations.length; i++) {
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2], locations[i][3]),
            map: map,
            content: locations[i][0]
        });

        bounds.extend(marker.position); 

        var infowindow = new google.maps.InfoWindow();                  

        google.maps.event.addListener(marker, 'click', (function(marker, i, infowindow) {
           return function () {

                if(openedInfoWindow[i] != null){                            
                    openedInfoWindow[i].close(); 
                    openedInfoWindow[i] = null;
                }else{                   
                   infowindow.setContent(this.content); 
                   infowindow.open(map, this); 
                   openedInfoWindow[i] = infowindow;
                   google.maps.event.addListener(infowindow, 'closeclick', function() {
                      openedInfoWindow[i] = null;                        
                  });
                }   
            }               
        })(marker, i, infowindow));         

        google.maps.event.trigger(marker, 'click');
    }

    map.fitBounds(bounds);

    var listener = google.maps.event.addListener(map, "idle", function () {
        map.setZoom(9);
        google.maps.event.removeListener(listener);
    });
}
function loadScript() {
    var script = document.createElement('script');
    script.src = 'https://maps.googleapis.com/maps/api/js?key=AIzaSyADTnbl7e9y2o13cXkUFO8RZpXFJI-yzp4&' + 'callback=initialize';
    document.body.appendChild(script);
}

window.onload = loadScript;
</script>`

图1=现在

图2=所以它必须是

Answer 1

我建议您泛化它，在数组中添加一个成员以确定是否打开标记。

var locations = [
    // IW content, lat, lng, nowrap, open IW
    ['Oddział', 52.846190, 17.723237, 3, true],
    ['Oddział', 52.812224, 17.201023, 2, true],
    ['Zakład Poligraficzny - Siedziba', 52.847942, 17.757889, 1, false]       
];

然后这样做来打开信息：

if (locations[i][4]) {
  google.maps.event.trigger(marker, 'click');
}

概念小提琴的证明

代码片段：

​

function initialize() {
  var openedInfoWindow = [];
  var locations = [
    ['Oddział', 52.846190, 17.723237, 3, false],
    ['Oddział', 52.812224, 17.201023, 2, true],
    ['Zakład Poligraficzny - Siedziba', 52.847942, 17.757889, 1, true]
  ];
  var cityCircle;
  var map = new google.maps.Map(document.getElementById('map-canvas'), {
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    zoomControl: true,
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.SMALL
    }

  });

  var bounds = new google.maps.LatLngBounds();

  for (i = 0; i < locations.length; i++) {
    var marker = new google.maps.Marker({
      position: new google.maps.LatLng(locations[i][1], locations[i][2], locations[i][3]),
      map: map,
      content: locations[i][0]
    });

    bounds.extend(marker.position);

    var infowindow = new google.maps.InfoWindow();

    google.maps.event.addListener(marker, 'click', (function(marker, i, infowindow) {
      return function() {

        if (openedInfoWindow[i] != null) {
          openedInfoWindow[i].close();
          openedInfoWindow[i] = null;
        } else {
          infowindow.setContent(this.content);
          infowindow.open(map, this);
          openedInfoWindow[i] = infowindow;
          google.maps.event.addListener(infowindow, 'closeclick', function() {
            openedInfoWindow[i] = null;
          });
        }
      }
    })(marker, i, infowindow));

    if (locations[i][4]) {
      google.maps.event.trigger(marker, 'click');
    }
  }

  map.fitBounds(bounds);

  var listener = google.maps.event.addListener(map, "idle", function() {
    map.setZoom(9);
    google.maps.event.removeListener(listener);
  });
}

function loadScript() {
  var script = document.createElement('script');
  script.src = 'https://maps.googleapis.com/maps/api/js?' + 'callback=initialize';
  document.body.appendChild(script);
}

window.onload = loadScript;

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

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map-canvas"></div>

​