單擊相同的標記兩次將打開兩個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答案 。