谷歌地图API v3（同一时间只打开一个信息窗口）

Question

请问是否有方法修改这段代码，使得谷歌地图在打开新的信息窗口时自动关闭其他窗口？

换句话说，我希望始终只有一个信息窗口是打开的。我在stackoverflow上查找过，但似乎无法将其他用户的解决方案应用到这段代码中。

function initMapsDealers(){

objectLocation = new google.maps.LatLng(25.64152637306577, 1.40625);

var myOptions = {
    scrollwheel: false,
    zoom: 2,
    center: objectLocation,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}

var map = new google.maps.Map(document.getElementById("map-canvas-dealers"), myOptions);
var image1 = '/gfx/iconPloegerGreen.png';
var image2 = '/gfx/iconPloegerGreen.png';
var image3 = '/gfx/iconPloegerDealer.png';

/* Info windows */
<?

function replace_newline($string) {
  return (string)str_replace(array("\r", "\r\n", "\n"), '', $string);
}


$i = 0;
foreach($dealers as $dealer)
{
    $dealerLanden[$dealer['Land']][] = $dealer;

    if($dealer['lat'] != "" && $dealer['lon'] != "")
    {
        $i++;

        ?>
        objectLocation<?= $i; ?> = new google.maps.LatLng(<?= $dealer['lat']; ?>, <?= $dealer['lon']; ?>);

        var contentString<?= $i; ?> =
            '<div class="infoWindow">'+
            '<strong><?= str_replace("'","", $dealer['name']); ?></strong><br>'+
            '<?= replace_newline($dealer['content']); ?>'+
            '</div>';

        var infowindow<?= $i; ?> = new google.maps.InfoWindow({
            content: contentString<?= $i; ?>
        }); 

        var marker<?= $i; ?> = new google.maps.Marker({
            position: objectLocation<?= $i; ?>,
            title:"<?= $dealer['name']; ?>",
            map: map,
            icon: <?

            if($dealer['group'] == "Hoofdkantoor"){ ?>image1<? }
            elseif($dealer['group'] == "Oxbo"){ ?>image2<? }
            elseif($dealer['group'] == "Dealers"){ ?>image3<? } 
            else{ ?>image1<? }?>

        }); 

        google.maps.event.addListener(marker<?= $i; ?>, 'click', function() {
            infowindow<?= $i; ?>.open(map,marker<?= $i; ?>);
        });
        <?
    }
}

?>                      

resizeSection();

};

- Frank Kluytmans

---

可能是重复的问题：Google Maps API - 如何打开单个infoWindow - Marcelo

Answer 1

这是我解决同时只打开一个信息窗口的方法：

infowindow = new google.maps.InfoWindow({
    content: infocontent,
    maxWidth: 200
});
google.maps.event.addListener(marker, 'click', function() {

    if($('.gm-style-iw').length) {
         $('.gm-style-iw').parent().hide();
    }
    infowindow.open(map,marker);
    
});

- Jules

---

remove()函数可能会引发空指针异常。我认为最好使用 $(".gm-style-iw").parent("div").hide();。 - hdt

Answer 2

有一条谷歌推荐：如果你只想要一个InfoWindow，可以参考InfoWindow API文档。

具体步骤如下：

1. InfoWindow可以附加到标记对象（在这种情况下，它们的位置基于标记的位置）或地图本身上指定的经纬度。如果你只想在同一时间显示一个信息窗口（就像在Google Maps上的行为），那么你只需要创建一个信息窗口，在地图事件（例如用户点击）发生时重新指定到不同的位置或标记上。不同于Google Maps API V2中的行为，现在地图可以同时显示多个InfoWindow对象。

2. 要更改信息窗口的位置，您可以通过在信息窗口上调用setPosition()显式更改其位置，或使用InfoWindow.open()方法将其附加到新的标记上。请注意，如果在不传递标记的情况下调用open()，InfoWindow将使用通过InfoWindow选项对象在构建期间指定的位置。

所以，尝试按照这些建议操作。

- FrVaBe

---

InfoWindow文档的正确链接为https://developers.google.com/maps/documentation/javascript/infowindows。 - chikamichi