谷歌地图InfoBubble窗口既不关闭也不重新定位地图

Question

我使用InfoBubble here成功运作 GM 原型。

当我打开每个新的 InfoBubble窗口时，我需要地图重新定位。

地图会在关闭每个InfoBubble时重新定位，因为我调用[第238行等]：

google.maps.event.addListener(infoBubble, "closeclick", function ()

其次，为什么洛杉矶（美国西海岸，洛杉矶）InfoBubble还关闭了最新的InfoBubble窗口，就像所有其他人一样，请呢？

非常感谢任何建议;我知道这一定很简单 - 但是花了几个小时，也搜索了S / O！

的javascript：

    $(document).ready(function () { initialize();  });
    var myLatlng = new google.maps.LatLng(51.30, 0.7);
    function initialize() {
        google.maps.Map.prototype.setCenterWithOffset = function(LatLng, offsetX, offsetY) {
            var map = this;
            var ov = new google.maps.OverlayView();
            ov.onAdd = function() {
                var proj = this.getProjection();
                var aPoint = proj.fromLatLngToContainerPixel(LatLng);
                aPoint.x = aPoint.x+offsetX;
                aPoint.y = aPoint.y+offsetY;
                map.setCenter(proj.fromContainerPixelToLatLng(aPoint));
            }; 
            ov.draw = function() {}; 
            ov.setMap(this); 
        };
        var centerMap = new google.maps.LatLng(51.30, 0.7);
        var mapOptions = {
            zoom: 2,
            disableDefaultUI: true,
            scrollwheel: false,
            navigationControl: false,
            mapTypeControl: false,
            scaleControl: false,
            draggable: false,
            center: centerMap,
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
        map.setCenterWithOffset(myLatlng, 50, 225);
        setMarkers(map, sites);
        google.maps.event.addListener(infoBubble, "closeclick", function () {
            map.setCenterWithOffset(myLatlng, 50, 225);
        });
        google.maps.event.addListener(infoBubbleLA, "closeclick", function () {
            map.setCenterWithOffset(myLatlng, 50, 225);
        });
    };

    var infoBubble = new InfoBubble({
        maxWidth: 400,
    });

    var infoBubbleLA = new InfoBubble({
        maxWidth: 400,
    });

 // locationstrings start
    var losangeles1 = 'losangeles1';
    var losangeles2 = 'losangeles2';
    var losangeles3 = 'losangeles3';
    var losangeles4 = 'losangeles4';
    var losangelescontentString ='losangelescontentString';
    var portonovocontentstring ='Porto Novo';
    var shackletoncontentstring = 'Shackleton';
    var florencecontentstring = 'Florence';
    var buenosairescontentstring = 'Buenos Aires';
    var jodhpurcontentstring = 'Jodhpur';
    var mtsinaicontentstring = 'Mt Sainai';
    var neworleanscontentstring = 'New Orleans';
    var pariscontentstring='Paris';

 // locationstrings end

    infoBubbleLA.addTab('Electronic Cataloguing Initiative', losangeles1);
    infoBubbleLA.addTab('Getty Leadership Institute at Claremont Graduate University', losangeles2);
    infoBubbleLA.addTab('Tab 3', losangeles3);
    infoBubbleLA.addTab('Preserve L.A.', losangeles4);

    var sites = [
    //   'Title',        lat,      long,       contentstring
        ['Los Angeles', 34.054082,-118.24261, losangelescontentString],
        ['Porto Novo', 6.501411,2.604275, portonovocontentstring],
        ['Shackleton', -77.550000, 166.150000, shackletoncontentstring],
        ['Florence', 43.773046,11.255901, florencecontentstring],
        ['Buenos Aires', -34.578528,-58.526273, buenosairescontentstring],
        ['Jodhpur', 27.199507,73.73826, jodhpurcontentstring],
        ['Mt Sinai', 28.555972,33.975048, mtsinaicontentstring],
        ['New Orleans', 29.984676,-90.063171, neworleanscontentstring],
        ['Paris', 48.821799,2.404933, pariscontentstring]
    ];

    var iconBase = 'http://gettylabs.org/visit/FoundationMap/images/';
    function setMarkers(map, markers) {
        for (var i = 0; i < markers.length; i++) {
            var sites = markers[i];
            var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);
            var marker = new google.maps.Marker({
                icon: iconBase + 'bullet.png',
                title: sites[0],
                position: siteLatLng,
                html: sites[3],
                map: map
            });
            google.maps.event.addListener(marker, "click", function () {
                map.setCenterWithOffset(myLatlng, 50, 25);
                if (this.html == losangelescontentString) {
                    infoBubbleLA.setContent(this.html);
                    infoBubbleLA.open(map,this);
                } else {
                    infoBubble.setContent(this.html);
                    infoBubble.open(map,this);
                }
            });
        };
    };

Answer 1

您在代码infoBubbleLA和infoBubble中有2个不同的InfoBubbles。打开一个不会关闭另一个。

    var infoBubble = new InfoBubble({
        maxWidth: 400,
    });

    var infoBubbleLA = new InfoBubble({
        maxWidth: 400,
    });

这应该这样做：

    google.maps.event.addListener(marker, "click", function () {
                map.setCenterWithOffset(myLatlng, 50, 25);
                if (this.html == losangelescontentString) {
                    infoBubbleLA.setContent(this.html);
                    infoBubbleLA.open(map,this);
                    infoBubble.close();
                } else {
                    infoBubble.setContent(this.html);
                    infoBubble.open(map,this);
                    infoBubbleLA.close();
                }
            });

working fiddle