将GoogleMaps InfoWindow带到前面

Question

我有一个GoogleMaps APIv3应用程序,其中可以同时打开多个InfoWindows.如果点击它的任何部分,我希望能够将一个模糊的InfoWindow带到所有其他InfoWindows的前面 - 类似于MS Windows OS中Windows的行为.

我曾想过添加一个onclick事件处理程序来增加InfoWindow的z-index,但是事件处理程序似乎没有被触发.ZIndex是一个全局变量,随着InfoWindows被点击而不断增加 - 或者说无论如何都是理论.

有人可以帮忙吗？这是我的代码: -

var ZIndex=1;
var iw = new google.maps.InfoWindow({ content:contentString });
google.maps.event.addListener(iw, 'click', handleInfoWindowClick(iw) );

function handleInfoWindowClick(infoWindow) {
   return function() {
      infoWindow.setZIndex(ZIndex++);
   }
}

Answer 1

对于infoWindow没有click事件,这有点困难.

1. 你需要使用一个元素(不是一个字符串)作为infowindow的内容,因为你需要一个DOMListener而不是一个infowindow-object的监听器
2. 当domready-fires时,你必须将click-DOMListener应用于定义infowindow的内容节点的anchestor

以下代码将为您执行此操作,将其添加到您的页面:

google.maps.InfoWindowZ=function(opts){
          var GM = google.maps,
              GE = GM.event,
              iw = new GM.InfoWindow(),
              ce;

             if(!GM.InfoWindowZZ){
                GM.InfoWindowZZ=Number(GM.Marker.MAX_ZINDEX);
             }

             GE.addListener(iw,'content_changed',function(){
               if(typeof this.getContent()=='string'){
                  var n=document.createElement('div');
                      n.innerHTML=this.getContent();
                      this.setContent(n);
                      return;
               }
               GE.addListener(this,'domready',
                               function(){
                                var _this=this;
                                _this.setZIndex(++GM.InfoWindowZZ);
                                if(ce){
                                  GM.event.removeListener(ce);
                                }
                                ce=GE.addDomListener(this.getContent().parentNode
                                                  .parentNode.parentNode,'click',
                                                  function(){
                                                  _this.setZIndex(++GM.InfoWindowZZ);
                                });
                              })
             });

             if(opts)iw.setOptions(opts);
             return iw;
        }

而不是google.maps.InfoWindow()你现在必须打电话google.maps.InfoWindowZ()

它还返回一个真正的InfoWindow,但是应用了上面提到的侦听器.它还在需要时根据内容创建节点.

演示:http://jsfiddle.net/doktormolle/tRwnE/

visualRefresh的更新版本(使用鼠标悬停而非点击)http://jsfiddle.net/doktormolle/uuLBb/