Google Maps API v3 (одновременно открывается одно информационное окно)

Кто-нибудь знает, как изменить этот код, чтобы карты Google закрывали информационные окна, когда вы открываете другое?

Другими словами, я хочу, чтобы всегда было открыто только одно информационное окно. Я посмотрел на 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();

};

google-maps javascript google-maps-api-3 infowindow
person Frank Kluytmans    schedule 27.02.2013    source источник
comment
возможный дубликат API Карт Google - открытие одного информационного окна   -  person Marcelo    schedule 27.02.2013

Ответы (2)


arrow_upward
2
arrow_downward

Существует рекомендация Google, что делать, если вам нужна только одна документация API для InfoWindow< /а>.

It is:

InfoWindows могут быть прикреплены либо к объектам Marker (в этом случае их положение зависит от местоположения маркера), либо к самой карте с указанным LatLng. Если вы хотите, чтобы единовременно отображалось только одно информационное окно (как это происходит на Картах Google), вам нужно создать только одно информационное окно, которое вы можете переназначить различным местоположениям или маркерам при событиях на карте (например, клики пользователя). Однако, в отличие от поведения в V2 API Карт Google, карта теперь может отображать несколько объектов InfoWindow, если вы того пожелаете.

Чтобы изменить расположение информационного окна, вы можете либо явно изменить его положение, вызвав setPosition() в информационном окне, либо прикрепив его к новому маркеру с помощью метода InfoWindow.open(). Обратите внимание, что если вы вызываете open() без передачи маркера, InfoWindow будет использовать позицию, указанную при построении через объект опций InfoWindow.

Поэтому постарайтесь следовать этим советам.

person FrVaBe    schedule 27.02.2013
comment
Правильная ссылка на документацию InfoWindow: developers.google.com/maps/documentation/javascript/infowindows. - person chikamichi; 29.05.2014

arrow_upward
3
arrow_downward

Это мое решение, чтобы одновременно было открыто только одно информационное окно:

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().remove();
    }
    infowindow.open(map,marker);

});
person Jules    schedule 17.01.2014
comment
Функция remove() может вызвать нулевое исключение. Я думаю, что лучше использовать $(.gm-style-iw).parent(div).hide(); - person Hristo Tomov; 04.08.2016