Google Map V3 - allows you to display only one info box at a time

I am moving from infoWindow to infoBox for more convenient info windows.

I have several markers on the map. What I want to do is when one infoBox already open, if the user clicks on other tokens, the current infoBox closes automatically and a new infoBox so that the user does not need to close the current infoBox and only one infoBox will always be displayed.

Here is the demo and code of my current solution http://jsfiddle.net/neo3000ultra/9jhAy/

Thanks in advance!

+4
source share
2 answers

Change this part:

  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); 

to the next:

  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); }); 

Works for me, also in IE9: http://jsfiddle.net/doktormolle/9jhAy/1/

Pay attention to using ib.close() before opening infoBox, this seems to be a trick.

+10
source

The usual sentence for a single info window should only create it, and then reuse it for all markers (changing its contents).

Here is an example that does this with the v3 API (I think it's like "v2 infowindow behavior" because the v2 API allowed only one info window) http://www.geocodezip.com/v3_markers_normal_colored_infowindows.html

Here is another example based on Mike Williams's v2 tutorial: http://www.geocodezip.com/v3_MW_example_map1.html

and your example is modified: http://jsfiddle.net/uGnQb/6/

+3
source

Source: https://habr.com/ru/post/1416283/


All Articles