InfoBubble“closeclick”的事件监听器。怎么设置?

时间:2014-04-16 03:50:28

标签: google-maps events infobubble

如何为关闭InfoBubble的事件设置监听器? 我正在使用GoogleMap API v.3和编译的infobubble脚本。 它不起作用:

infoBubble = new InfoBubble({
  maxWidth: 500
});

infoBubble.open(map, marker);

google.maps.event.addListenerOnce(bubble, 'domready', function(){ 
   google.maps.event.addDomListener(infoBubble, 'close', function() {  
      alert("Closed");
   }); 
}); 

找到解决方案。这是平庸的。没有记录的坏。不得不学习反编译的代码。

        google.maps.event.addListener(infoBubble, 'closeclick', function(){
            console.info("I'm Closed");
        });

2 个答案:

答案 0 :(得分:0)

无需使用addListener来关闭Opened InfoBubble。 (在许多情况下可能会帮助你,但对于简单的应用程序,我们不需要它)

只需像open方法一样使用close方法打开infoBubble。

示例:

打开InfoBubble(你知道的)

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

关闭InfoBubble

infoBubble.close();

答案 1 :(得分:0)

我的功能:

function createMarker(point, mOptions, mType, html1, html2, pointX, units) {

    /** -------------
    *     Variable  
    **/

    var Title   = mOptions.title;
    var Name    = mOptions.name;
    var Mode    = mOptions.mode;
    var MiniMode= mOptions.mini;
    var User_id = mOptions.user;
    var id = mOptions.id;

    markersOptions.push(id);
    markersOptions[id] = {avatar: ''};

    if(!Mode){
        var Author = mOptions.author;
        var Event_id = mOptions.event;
        var Picture = mOptions.pic;
        var add_form  = create_adcomm_form(2, Event_id);
        var add_foto  = create_adfoto_form(2, Event_id);
        var comm_header = create_comm_head(Event_id);
        var links_block = create_links(Event_id);
    }   

    /** --------------------
    *    Create new Marker  
    **/

    var marker = new google.maps.Marker({
        position: point, 
        map: map,
        icon: mOptions.icon,
        title: mOptions.title
    });


    google.maps.event.addListener(marker, 'click', function() 
    {
        /**
        *  Add Polyline & Distance 
        **/
        var path = [pointX, point];
        clear_polyline();

        var polyline_shadow = new google.maps.Polyline({
            path: path,
            strokeColor: '#000000',
            strokeOpacity: .6,
            strokeWeight: 3,
            map: map
        });
        pline.push(polyline_shadow);

        var polyline = new google.maps.Polyline({
            path: path,
            strokeColor: '#FFFF00',
            strokeOpacity: 1.0,
            strokeWeight: 2,
            map: map
        });
        line.push(polyline);


        var dist = polyline.inKm();
        var calc = (units == 'miles') ? "1.609344" : "1";
        var distance = (dist/calc);
        var distanceText = (distance) ? "<br />"+Lng[8]+": " + formatNumber(distance,2,',','.','','','-','') + " " + units: '';

        /**
        *  END Polyline & Distance 
        **/     

        if(!Mode){  // Add Listener for Event

        ....... Other       

        }else{ // Add Listener for Users

            html2 = '<div style="overflow:auto;">'+html2+'</div>';

            infoBubble.close();

            infoBubble = new InfoBubble({
              maxWidth: 500,
              minWidth: 300,
              minHeight: 300

            });
            infoBubble.open(map, marker);


            var divUser = document.createElement('DIV');
            divUser.setAttribute("align", "center");
            divUser.innerHTML = html1 + distanceText;

            var divUser2 = document.createElement('DIV');
            divUser2.setAttribute("align", "center");
            divUser2.innerHTML = html2;

            infoBubble.addTab(Lng[9], divUser);
            infoBubble.addTab(Lng[10], divUser2);

            google.maps.event.addListener(marker, 'click', function() {
              if (!infoBubble.isOpen()) {
                infoBubble.open(map, marker);
              }
            });

            var is_ava = get_avatar(User_id, markersOptions[id], id);
            console.info('IS AVA:   '+is_ava);
        }       
    });
    google.maps.event.addListenerOnce(infoBubble, 'domready', function(){ 
       google.maps.event.addDomListener(infoBubble, 'close', function() {  
          console.info("Closed");
          //clear_polyline();  // <----- HOW ? 
       }); 
    });

    markers.push(marker);
    return marker;
}

function clear_polyline(){
    for (i=0; i<line.length; i++) {                           
        line[i].setMap(null); 
        pline[i].setMap(null);
    }
}

function get_avatar(User_id, markersOptionsID, id){    
    var avatar = markersOptionsID.avatar;
    if(!avatar || avatar == ''){
        jQuery.ajax({
            type: "GET",
            url: "ajax/jq_ajax.php",
            data: ({user_id:User_id, mode:'get_avatar'}),
            success: function(ava) {
                jQuery('#user_avatar'+User_id+'').html('');
                jQuery('#user_avatar'+User_id+'').append(ava);
                markersOptions[id].avatar = addslashes(ava);
                return false;
            }
        });
    }else{
        return true;
    }
}