Google Maps v3 Центрирование и управление Infowindow

Question

У меня есть карта с флажками, позволяющими пользователям выбирать, что они хотели бы отображать на карте. Все работает хорошо, за исключением следующих двух пунктов.

1. Когда пользователь выбирает элемент из списка, маркер действительно отображается на карте, однако карта не перецентрируется на маркере. Это необходимо для маркера, который находится за пределами видимой области карты при загрузке страницы.

2. Когда у меня открыто несколько маркеров на карте, я хотел бы, чтобы за один раз было открыто только одно информационное окно, в настоящее время, если я нажму на 10 маркеров, будет открыто 10 информационных окон. Я хотел бы иметь его там, где, если информационное окно открыто и щелкает другой маркер, тогда первое информационное окно закрывается.

Я вставил фрагмент кода для одного из маркеров ниже, любая помощь будет принята с благодарностью!

    jQuery(document).ready(function(){
        /**
        * The Map object.
        * @type {google.maps.Map}
        */
        var mapOptions = {
            center: new google.maps.LatLng(36.812946,-119.746953),
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.SATELLITE
        };
        var map = new google.maps.Map(document.getElementById("map"), mapOptions);



        /**
        * The markers array.
        * @type {Object}
        */
        var markers = {};


            markers.building37 = [];

            var marker0237  = new google.maps.Marker({
                visible: false,
                icon: new google.maps.MarkerImage("images/website/brown_Marker.png",new google.maps.Size(32,37),null,null),
                title: 'Building',
                position: new google.maps.LatLng(36.80694607313768,-119.73590791225433),
                center: position,
                map: map
            });

            markers.building37.push(marker0237);  

            var info_window0237 = new google.maps.InfoWindow({
                content: '<div id="infobubble"><div id="img"><img src="images/buildings/Foundation001.jpg" alt="Foundation Building"></div><div id="desc"><h3>Foundation</h3></div></div>',
                maxWidth:350,
            });

            google.maps.event.addListener(marker0237, "click", function() {
                info_window0237.open(map,marker0237);
            });



    var showBuilding37 = false;

    var mgrBuilding37 = null;


        /**
        * Toggles Building 37 Marker Group visibility.
        */
        function toggleBuilding37()
        {
            showBuilding37 = !showBuilding37;
            if (showBuilding37)
                for (var i=0; i < markers.building37.length; i++)
                    markers.building37[i].setVisible(true);
            if (mgrBuilding37)
            {
                if (showBuilding37)
                {
                    mgrBuilding37.addMarkers(markers.building37, 0);
                    mgrBuilding37.refresh();
                } 
                else
                {
                    mgrBuilding37.clearMarkers();
                    mgrBuilding37.refresh();
                }
            }
            else 
            {
                mgrBuilding37 = new MarkerManager(map, {trackMarkers: true, maxZoom: 15});
                google.maps.event.addListener(mgrBuilding37, "loaded", function() {
                    if (showBuilding37)
                    {
                        mgrBuilding37.addMarkers(markers.building37, 0);
                        mgrBuilding37.refresh();
                    } 
                    else
                    {
                        mgrBuilding37.clearMarkers();
                        mgrBuilding37.refresh();
                    }
                });
            }
        }            

          google.maps.event.addDomListener(
              document.getElementById("building37-cb"),"click", toggleBuilding37);  

    });

Answer 1

Я не вижу, где вы устанавливаете центр карты.

1. Вы должны сделать что-то вроде map.setCenter(location); при добавлении маркера.

2. Вы должны хранить список информационных окон, а при отображении одного из них переходить к другим и скрывать их информационные окна.

       //Declare your info window array
       var infoWindows = new Array();
   
       var info_window0237 = new google.maps.InfoWindow({
           content: '<div id="infobubble"><div id="img"><img src="images/buildings/Foundation001.jpg" alt="Foundation Building"></div><div id="desc"><h3>Foundation</h3></div></div>',
           maxWidth:350,
       });
   
       //After you make an infowindow, add it to the array
       infoWindows.push(info_window0237);
   
       google.maps.event.addListener(marker0237, "click", function() {                          
             //When you show an infowindow on click, hide the rest
             for(i = 0; i < indowWindows.length; i++)
             {
                  //this will close all the infowindows you added to the array
                  infoWindows[i].close();
             }
             info_window0237.open(map,marker0237);
   
       });