Question

我设置了一个谷歌地图，其中信息框在页面加载时隐藏。要打开信息框，我会点击自定义标记（图钉）并显示信息框。如果我是第二次点击标记，信息框将关闭。

现在，自最新的谷歌地图。信息框在加载时自动打开，单击标记无效。不关闭，不打开。

这是信息框的代码。

全部谢谢！

 // infobox
            var $infoboxText =
                $('<div class="inner">').html(contentHtml);

            var myOptions = {
                boxClass:'gmap_infobox',
                content:$infoboxText.get(0),
                disableAutoPan:false,
                maxWidth:0,
                alignBottom:false,
                pixelOffset:new google.maps.Size(0, 0),
                zIndex:null,
                closeBoxURL:"",
                infoBoxClearance:new google.maps.Size(1, 1),
                isHidden:false,
                pane:"floatPane",
                enableEventPropagation:false
            };

            var InfoBoxClose = function () {
                myOptions.boxClass = 'gmap_infobox';
                ib.setOptions(myOptions);
            };

            var InfoBoxOpen = function () {
                var $content = $(myOptions.content);

                if ($content.html().length > 0) {
                    myOptions.boxClass = $content.is(':visible') ? 'gmap_infobox' : 'gmap_infobox gmap_infobox--visible';
                    ib.setOptions(myOptions);
                }
            };

            InfoBox.prototype.getCloseClickHandler_ = function () {
                return handleInfoBoxClose;
            };

            var ib = new InfoBox(myOptions);
            ib.open(map, marker);

            if (config.marker === 'open-bubble') {
                InfoBoxOpen();
            }

            // listeners
            google.maps.event.addListener(marker, 'click', function() {
                InfoBoxOpen();
            });
        }

Answer 1

首先，浏览一下：the reference api。特别是InfoWindow和InfoWindowOptions上的部分。

然后尝试一下

var map, myInfoWindow;
function initialize() {
    //Create the map
    var mapOptions = {
        zoom: 4,
        center: new google.maps.LatLng(38.8282, -98.5795),
    };
    map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions);

    //Create the infoWindow
    var iwOptions = {content: "stuff"};    //put your infowindow options here
    myInfoWindow = new google.maps.InfoWindow(iwOptions);

    //coordinates for marker placement
    var myLatLng = [
                    new google.maps.LatLng(32, -83),
                    new google.maps.LatLng(41, -90),
                    new google.maps.LatLng(38, -109)
                   ];

    //Create markers
    for(var i=0; i<myLatLng.length; i++){
        var marker = new google.maps.Marker({
            position: myLatLng[i],
            map: map
        })

        //This is the important part: add this to each of you markers
        google.maps.event.addListener(marker, 'click', function(){
            if( myInfoWindow.anchor === this ){
                myInfoWindow.close();
            } else {
                myInfoWindow.open(map, this);
            }
        });
    }
}
google.maps.event.addDomListener(window, 'load', initialize);

单击标记时，Google地图信息框无法正常工作

1 个答案: