单击相同的标记两次将打开两个InfoWindows

Question

我可以使用信息窗口，但是由于某些原因，如果我多次单击同一标记，则会打开同一信息窗口的多个窗口。 我觉得它必须与我的代码有关，但是我不能完全理解它是什么。 任何帮助表示赞赏。

var map;
var markers = [];

function initMap() {
    map = new google.maps.Map(document.getElementById('map_canvas'), {
        zoom: 14,
        center: new google.maps.LatLng(33.6894120, -117.9872660),
        mapTypeId: 'roadmap',
        disableDefaultUI: true
    });



    function addMarker(feature) {
        var marker = new google.maps.Marker({
            position: feature.position,
            icon: icons[feature.type].icon,
            map: map,
            type: feature.type,
            title: feature.title,
            description: feature.description
        });
        marker.addListener('click', function() {
            map.setCenter(marker.getPosition());

            var infoWindow = new google.maps.InfoWindow({
                map: map, 
                pixelOffset: new google.maps.Size(0, -60)
            });
            infoWindow.setContent(marker.description);
            infoWindow.setPosition(marker.position);

            google.maps.event.addListener(map, 'drag', function() {
                infoWindow.close();
            });
            google.maps.event.addListener(map, 'click', function() {
                infoWindow.close();
            });
        });
        markers.push(marker);
    }

    filterMarkers = function(getType) {
        //console.log(getType);
        for (var i = 0; i < markers.length; i++) {
            if (markers[i].type == getType || getType == "") {
                markers[i].setVisible(true);
            } else {
                markers[i].setVisible(false);
            }
        }
    }

    var features = [

        {
          position: new google.maps.LatLng(-33.91721, 151.22630),
          type: 'type1',
          description: 'Description1'
        },{
          position: new google.maps.LatLng(-33.91721, 151.22630),
          type: 'type2',
          description: 'Description2'
        },{
          position: new google.maps.LatLng(-33.91721, 151.22630),
          type: 'type3',
          description: 'Description3'
        }


    ];

    for (var i = 0, feature; feature = features[i]; i++) {
        addMarker(feature);
    }
}

$(document).ready(function(){
    initMap();
});

Answer 1

如果您不想在每次单击标记时都创建一个信息窗口，则不要在每次单击标记时都创建一个新的信息窗口，而不必为标记创建一个新的信息窗口（如果只想创建一个，则为地图创建一个）打开），然后在点击监听器中将其打开。

function addMarker(feature) {
  var marker = new google.maps.Marker({
    position: feature.position,
    map: map,
    type: feature.type,
    description: feature.description
  });
  // create infowindow for the marker 
  var infoWindow = new google.maps.InfoWindow({});
  marker.addListener('click', function() {
    map.setCenter(marker.getPosition());
    // set the content of the infowindow
    infoWindow.setContent(marker.description);
    // open the infowindow on the marker.
    infoWindow.open(map,marker);
  });
  markers.push(marker);
}

概念证明

Answer 2

每次单击标记都将创建一个新的InfoWindow ：

marker.addListener('click' ... var infoWindow = *new google.maps.InfoWindow( ...*

预计您将获得多个实例。

如果要为所有标记使用一个InfoWindow ，则可以按照以下示例进行操作

如果您希望每个标记都有一个，请查看此SO答案 。