使用Google Maps V3静态信息窗口(暂时禁用事件)gmap3

时间:2014-03-06 17:45:29

标签: google-maps static infowindow

我使用jquery gmap3。

当我显示infowindow时是否可以暂时禁用正在运行的事件监听器,并且当我单击infowindow上的关闭按钮时启用它们?

编辑: 这是在触发“click”事件(对于大信息窗口)或鼠标悬停(然后变量“shortwindow”将为“s”)时将被调用的函数。

function infoWindow_open(thismap, marker, id, language, shortwindow) {
// Get InfoWindow with AJAX-Request
$.ajax({
    type: "POST",
    url: "getInformation_ajax.php",
    data: "id="+encodeURIComponent(id)+"&language="+encodeURIComponent(language),
    success: function(data) {
        var json = $.parseJSON(data);
        if(json.infownd === null || json.infowndshort === null) {
            return;
        }

        var map = thismap.gmap3("get"),
        infowindow = thismap.gmap3({get:{name:"infowindow"}});
        if(shortwindow == "s") {  // Short infowindow on mouseover
            content_ = "<h class=name_gmap3'>"+json.infowndshort+"</h>";
            $('#test1').gmap3({ 
              map:{
                events:{
                  zoom: 2,
                  minZoom: 1,  // If 0: BUG!?
                  mapTypeId: google.maps.MapTypeId.SATELLITE,
                  //disableDefaultUI: true,
                  //panControl: true,
                  //zoomControl: true,
                  //scaleControl: true
                }}});
            if(infowindow) {
                infowindow.open(map, marker);
                //infowindow.setOptions({alignBottom: true});
                infowindow.setContent(content_);
            }
            else {
                thismap.gmap3({
                infowindow: { anchor:marker, options:{content: content_} }
                });
            }
        }
        else {
            if(infowindow) {
                infowindow.setOptions({maxWidth:350/*, pixelOffet: new google.maps.Size(50,-50)*/});
                infowindow.setContent(json.infownd);
                infowindow.open(map, marker);
            } else {
                thismap.gmap3({
                infowindow: { anchor:marker, options:{content: json.infownd/*, pixelOffet: new google.maps.Size(50,-50)*/} }
            });
          }
        }
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
    // Do nothing!
    //$("#erroutp#").html(textStatus);
    }
});
}

1 个答案:

答案 0 :(得分:0)

mouseover - 回调(打开小窗口)内部,检查大型InfoWindow的map - 属性。

如果不是null大信息窗是打开的,请离开mouseover - 回调而不打开小信息窗口。


修改后的代码有一些改进(删除了重复的部分,缓存了内容):

function infoWindow_open(thismap, marker, id, language, shortwindow) {
  //initialize infowindow on first run
  var infowindow  = thismap.gmap3({get:{name:"infowindow"}})
                      ||
                    thismap.gmap3({infowindow: {options:{'shortwindow':'s'} }})
                      .gmap3({get:{name:"infowindow"}}),
       key        = (shortwindow==='s')
                      ?'s':'l',
       //options for the InfoWindow
       iwOpts     = {
                      //small
                      s:{maxWidth:350},
                      //large
                      l:{}
                    },
       //options for the map
       mapOpts    = {
                      //small
                      s:{},
                      //large
                      l:{}
                    },
       //function that sets the content
       //and opens the window
       setOpts    = function(marker){
          //set infowindow-options
          infowindow.setOptions($.extend({},
                                         iwOpts[key],
                                         {
                                          content:marker.get('content')[key],
                                          //property to determine if it's
                                          //a small or large window
                                          shortwindow:shortwindow
                                         }
                                        )
                               );
          //open the infowindow                   
          infowindow.open(marker.getMap(),marker);
          //set map-options
          marker.getMap().setOptions(mapOpts[key]);
       }
  //leave the function onmouseover
  //when a big infowindow is open     
  if(shortwindow==='s' 
      && infowindow.get('shortwindow')!=='s'
        && infowindow.getMap()){
    return;
  }

  if(marker.get('content')){
    console.log('cached');
    setOpts(marker);
    return;

  }


  // Get InfoWindow-content with AJAX-Request
  $.ajax({
    type: "POST",
    url: "getInformation_ajax.php",
    data: "id="+encodeURIComponent(id)+"&language="+encodeURIComponent(language),
    success: function(data) {
        var json = $.parseJSON(data);
        if(json.infownd === null || json.infowndshort === null) {
            return;
        }
        //cache the content as marker-property
        marker.set('content',
                   {s:"<h3 class=name_gmap3'>"+json.infowndshort+"</h3>",
                    l: json.infownd});
        //open infoWindow          
        setOpts(marker);

    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
    // Do nothing!
    //$("#erroutp#").html(textStatus);
    }
});
}