打开一个新的（gMap v3）时关闭打开InfoBubble

问题描述

我不知道该怎么做......我只想关闭所有打开的 infoBubbles ，如果我要打开一个新的。我正在使用下面的代码。想法？我尝试了很多并且搜索了很多，但它不应该如此复杂，应该如此吗？我想创建一个数组并为开放ID保存ID，但我认为必须有另一个更简单的方法来解决这个问题。

  $（document）.ready（function（）{
 createmap（）; 
 
函数createmap（lat，lng）{
 var latlng = new google.maps .LatLng（50，10）; 
 var myOptions = {
 zoom：12，
 center：latlng，
 mapTypeId：google.maps.MapTypeId.ROADMAP 
} ; 
 
 map = new google.maps.Map（document.getElementById（map_canvas），myOptions）; 
 bounds = new google.maps.LatLngBounds（）; 
 createMarker （）; 
} 
 
函数createMarker（）{
 var markers = []; 
 var cm = window.cm = new ClusterManager（
 map ，
 {
 objClusterIcon：new google.maps.MarkerImage（'images / map / flag_cluster.png'，false，false，false，new google.maps.Size（20,20）），
 objClusterImageSize：new google.maps.Size（20,20）
} 
）; 
 
 var json = []; 
 var x1 = -85; 
 var x2 = 85; 
 var y1 = -180; 
 var y2 = 180; 
 for（var i = 0; i  json.push（
'{'+ 
'longitude：'+（x1 +（ Math.random（）*（x2-x1）））+'，'+ 
'latitude：'+（y1 +（Math.random（）*（y2-y1）））+'，'+ 
 
'title：test'+ 
'}'
）; 
} 
 json ='['+ json.join（）+']'; 
 // // eval在这里可以。 
 eval（'json = eval（json）;'）; 
 
 infos = []; 
 $ .each（json，function（i，item）{
 var contentString ='< div id =content>< a onclick =createdetailpage（'+ i +'）; >'+ item.title +'< br />< / a>< / div>'; 
 
 console.log（item.latitude）; 
 var myLatlng =新的google.maps.LatLng（item.latitude，item.longitude）; 
 var marker = new google.maps.Marker（{
 position：myLatlng，
 // map：map，
 flat：true，
 title：item.title，
 //动画：google.maps.Animation.DROP，
 //图标：myIcon 
}）; 
 var infoBubble = new InfoBubble（{
 content：'< div class =phoneytext>'+ contentString +'< / div>'
}）; 
 
 google.maps.event.addListener（标记，'click'，function（）{
 if（！infoBubble.isOpen（））{
 infoBubble.open（map，marker）; 
} 
}）; 
 cm.addMarker（marker，new google.maps.Size（50，50））; 
}）; 
 map.fitBounds（bounds）; 
} 
}）; 
  

解决方案

打开一个infoBubble的最简单方法是只有一个infoBubble，并根据点击的标记打开不同的内容。

I do not know what to do... I just want to close all opened infoBubbles if I'm going to open a new one. I am using the following code. Ideas? I tried a lot and googled a lot but it shouldn't be so complicated, should it? I thought to create an array and save id for the open one, but I think that there must be another, quite easier way to fix this.

$(document).ready(function(){
            createmap();

    function createmap(lat,lng){
        var latlng = new google.maps.LatLng(50, 10);
    var myOptions = {
    zoom: 12,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
    bounds = new google.maps.LatLngBounds();
            createMarker();
    }

    function createMarker(){
            var markers = [];
            var cm = window.cm = new ClusterManager(
                map,
                {
                    objClusterIcon: new google.maps.MarkerImage('images/map/flag_cluster.png', false, false, false, new google.maps.Size(20,20)),
                    objClusterImageSize: new google.maps.Size(20,20)
                }
            );

            var json = [];
            var x1 = -85;
            var x2 = 85;
            var y1 = -180;
            var y2 = 180;
            for (var i=0; i<20; ++i) {
                json.push(
                    '{'+
                        '"longitude":'+(x1+(Math.random()*(x2-x1)))+','+
                        '"latitude":'+(y1+(Math.random()*(y2-y1)))+','+

                        '"title":"test"'+
                    '}'
                );
            }
            json = '['+json.join()+']';
            // eval is ok here.
            eval('json = eval(json);');

            infos = [];
            $.each(json, function(i,item){      
    var contentString = '<div id="content"><a onclick="createdetailpage('+i+');">'+item.title+'<br /></a></div>';

                console.log(item.latitude);
                var myLatlng = new google.maps.LatLng(item.latitude,item.longitude);
            var marker = new google.maps.Marker({
                    position: myLatlng, 
                    //map: map, 
                    flat: true,
                    title:item.title,
                    //animation: google.maps.Animation.DROP,
                    //icon: myIcon
                });  
                var infoBubble = new InfoBubble({               
                    content: '<div class="phoneytext">'+contentString+'</div>'
                });                                

                google.maps.event.addListener(marker, 'click', function() {
                    if (!infoBubble.isOpen()) {
                        infoBubble.open(map, marker);
                    }
                }); 
                cm.addMarker(marker, new google.maps.Size(50, 50));                 
            });
        map.fitBounds(bounds);              
    }
    });

解决方案

The simplest approach to only have one infoBubble open is to only have one infoBubble and open it with different contents depending on the marker that is clicked.

InfoWindow example with custom markers (same concept applies to InfoBubble)

这篇关于打开一个新的（gMap v3）时关闭打开InfoBubble的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！