打开其他时如何关闭信息公牛?

时间:2013-09-09 14:37:13

标签: javascript google-maps

我在地图中显示了我的位置:

<script type="text/javascript" src="https://maps-api-ssl.google.com/maps/api/js?v=3&amp;sensor=true"></script>
<script type="text/javascript">
    var map;
    var markers = new Array();
    var infos = new Array();

    jQuery(document).ready(function(){
        var mapOptions = {
                zoom: 2,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        {% for position in positions %}
            var address = '{{ position.map_position }}';
            geocoder = new google.maps.Geocoder();
            geocoder.geocode( { 'address': address}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    var content_html  = '<div>';
                    content_html += '<label style="font-weight:bold;">country name : </label>{{ position.country.country_name }}<br/>';
                    content_html += '<label style="font-weight:bold;">city name : </label>{{ position.city.city_name }}<br/>';
                    {% if position.related > 1 %}
                    content_html += '<a style="color:black;" href="Mylink">My link</a>';
                    {% endif %}

                    if(jQuery.inArray('{{ position.map_position }}', markers) == -1){
                        map.setCenter(results[0].geometry.location);
                        var marker = new google.maps.Marker({
                            map: map,
                            icon: '{{position.icon}}',
                            position: results[0].geometry.location
                        });
                        markers.push('{{ position.map_position }}');
                        var infowindow = new google.maps.InfoWindow({
                            content: content_html
                        });
                        infos.push(infowindow);
                        google.maps.event.addListener(marker, 'click', function() {
                            infowindow.open(map,marker);
                        });
                    }
                    else {
                        var infowindow = infos[jQuery.inArray('{{ position.map_position }}', markers)];
                        infowindow.setContent(infowindow.getContent()+'<hr>'+content_html);
                    }
                }
            });
        {% endfor %}
    });
</script>

我在地图中显示了位置,但如果我有超过2个标记,我可以打开所有这些标记的信息公牛。我怎样才能同时打开一个信息公牛? (如果我打开一个信息公牛,其他所有人都保持关闭)

2 个答案:

答案 0 :(得分:0)

而不是创建多个infos作为数组。在初始化中创建一个infowindow。在您要打开infowindow的活动/听众中,您需要设置内容并在地图上的标记/位置上打开infowindow

//Initialize infowinow
var infowindow = new google.maps.InfoWindow({
       content: ''
 });

function add_marker(point, name, content_html)
{
   var marker = new google.maps.Marker({
      map: map,
      position: point,
      dragable: false,
      clickable: true,
      name: name
   });
   marker.content_html = content_html;
   google.maps.event.addListener(marker, 'click', function()
   {
      infowindow.setContent(marker.content_html);
      infowindow.open(map, marker);
   });
   return marker;
};

答案 1 :(得分:0)

我想分享解决方案以帮助进行下一次咨询......我刚刚取代了这个:

google.maps.event.addListener(marker, 'click', function() {
     infowindow.open(map,marker);
});

用这个:

google.maps.event.addListener(marker, 'click', function() {
    // Add a loop for closing all infowindows and after it we open the merkered one
    for(var i=0; i < infos.length; i++){
        infos[i].close();
    }
    infowindow.open(map,marker);
});