5

我有一个 GoogleMaps APIv3 应用程序,可以在其中随时打开多个 InfoWindows。如果单击它的任何部分,我希望能够将一个模糊的 InfoWindow 带到所有其他 InfoWindow 的前面 - 类似于 MS 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++);
   }
}
4

1 回答 1

6

infoWindow 没有点击事件,这有点困难。

  1. 您需要使用元素(而不是字符串)作为信息窗口的内容,因为您需要一个 DOMListener 而不是信息窗口对象的侦听器
  2. 当 domready-fires 时,您必须将 click-DOMListener 应用于定义 infowindow 的内容节点的锚点

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

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/

于 2013-01-16T03:14:47.490 回答