2012-06-06 42 views
4

我正在从infoWindow移动到infoBox,以获得更好的信息窗口。Google地图V3 - 一次只允许显示一个信息框

我在地图上有许多标记。我想要做的是当一个infoBox已经打开,如果用户点击其他标记,当前infoBox将自动关闭,新的infoBox将打开,以便用户不需要关闭当前infoBox,并且总会有一次只显示一个infoBox

这是我目前的解决方案的演示和代码提前 http://jsfiddle.net/neo3000ultra/9jhAy/

谢谢!

+1

重复:http://stackoverflow.com/q/1875596/1314132 –

+0

@Sean米奇这是infoBox,而不是infoWindow –

+0

对,我知道,但它是相同的概念,设计和基本代码。但无论如何,你已经为你的问题达成了解决方案,这就是重要的。 –

回答

10

更改这一部分:

 google.maps.event.addListener(marker, "click", function (e) { 
      ib.open(map, this); 
     }); 

     var ib = new InfoBox(myOptions); 

     google.maps.event.addListener(marker2, "click", function (e) { 
      ib2.open(map, this); 
     }); 

     var ib2 = new InfoBox(myOptions2); 

以下几点:

var ib = new InfoBox(); 

    google.maps.event.addListener(marker, "click", function (e) { 
     ib.close(); 
     ib.setOptions(myOptions) 
     ib.open(map, this); 
    }); 

    google.maps.event.addListener(marker2, "click", function (e) { 
     ib.close(); 
     ib.setOptions(myOptions2) 
     ib.open(map, this); 
    }); 

工作对我来说,也是IE9:http://jsfiddle.net/doktormolle/9jhAy/1/

注打开信息框前使用ib.close(),似乎是招。

+0

令人惊叹!现在完美的作品!非常感谢!!! –

3

单个infowindow的常见建议是只创建一个,然后将其重用于所有标记(更改其内容)。

这里是做一个例子,与v3的API(我认为它是“V2的信息窗口的行为”,因为V2 API只允许一个单一的信息窗口) http://www.geocodezip.com/v3_markers_normal_colored_infowindows.html

下面是另一个例子基于关闭麦克威廉姆斯的V2教程: http://www.geocodezip.com/v3_MW_example_map1.html

和你的例子修改: http://jsfiddle.net/uGnQb/6/

+0

谢谢。我尝试创建一个infoBox对象并重用它,但无法得到它的工作.... –

+0

这并不意味着它不会工作 – geocodezip

+0

嗨,我发现你的解决方案中一个非常棘手的问题。它可以在Firefox中正常工作,但是如果你在IE9中测试它,当你点击marker2,然后点击marker1关闭它,然后再次点击marker2,然后marker2的信息框内容将不会显示,而是显示损坏的信息框。你有什么想法发生了什么? –