Google Maps API: создание указателя магазинов

Сегодня я пытаюсь сделать локатор магазинов, используя api карт Google. Локатор магазинов должен быть настроен следующим образом: две области, одна с картой, содержащей все магазины в данной области (измеряется в выбираемом радиусе от центральной точки), и одна область со списком всех магазинов на карту, их информацию и, конечно же, ссылку на их веб-сайт. Когда человек щелкает по названию магазина в списке магазинов, он сосредотачивается на магазине на карте и открывает информационное окно над маркером магазина.

У меня есть переменная javascript, к которой я приложил все усилия, чтобы назначить некоторые данные json из сценария php (который выбирает эти данные на лету из базы данных)

locations = [{"siteurl":"http:\/\/localhost.localdomain\/5","address":"260 Test St","city":"Brooklyn","state":"New York","zip_code":"11206"},{"siteurl":"http:\/\/localhost.localdomain\/4","address":"3709 Testing St.","city":"Austin","state":"Texas","zip_code":"78705"}]; 

Теперь я знаю, что мне нужно запустить 5 различных функций, перечисленных ниже с их очевидным использованием:

1. geocoder.getLocations: используется для преобразования адресных данных (из объекта json) в объект данных широты и долготы.
2. addElementToList: используется для добавления адресной информации в список магазинов и привязки функции centerOnStore к onclick
3. centerOnStore при щелчке по элементу списка магазинов в области списка этот функциональный центр обращается к магазину, который был нажат в области карты. Эта функция также открывает информационное окно над магазином по центру.
4. placeMarker функция для размещения маркера на карте, вызываемая, когда геокодер возвращает объекты широты и долготы.
5. eventListener это каким-то образом связано с щелчком по элементу списка и дополнительно центрирует карту на рассматриваемом магазине

Что ж, похоже, я не в своей лиге. Я только сейчас изучаю закрытие javascript и думаю, что это может быть необходимо, но я не совсем понимаю их. Мне нужно найти способ привести все эти функции в рабочий порядок, передавая информацию друг другу взад и вперед, и создать локатор магазинов.

.

Вот что у меня есть, но с этим что-то не так.

    var map = null;
    var geocoder = null;
    var locations = null;
    var center_on = null;
    var zoom_level = null;
    var markerList = [];

    function initialize()
    {
            if(GBrowserIsCompatible())
            {
                    // Assign vars
                    map = new GMap2(document.getElementById("map_canvas"));
                    geocoder = new GClientGeocoder();
                    locations = <?php echo(json_encode($my_vars['locations'])); ?>;
                    center_on = "<?php echo($my_vars['center_on']); ?>";
                    zoom_level = <?php echo($my_vars['zoom_level']); ?>;
                    var currentLocation = 0;

                    geocoder.getLatLng(center_on, function(myPoint)
                    {
                            map.setCenter(myPoint, zoom_level);
                    });
                    map.setUIToDefault();


                    var list = document.getElementById('center_list');

                    for(var i = 0; i < locations.length; i++)
                    {
                            var address = locations[i]['address'] + ', ' + locations[i]['city'] + ' ' + locations[i]['state'] + ', ' + locations[i]['zip_code'];
                            geocoder.getLocations(address, addAddressToMap);
                    }

            }




            function addAddressToMap(response) {

                    if (!response || response.Status.code != 200) {
                            currentLocation++;
                    } else {
                    var place = response.Placemark[0];
                    var point = new GLatLng(place.Point.coordinates[1],
                            place.Point.coordinates[0]);
                    marker = new GMarker(point);
                    GEvent.addListener(marker, 'click', function(){
                            this.openInfoWindowHtml("<strong>" + place.address + "</strong><br /><a href='" + locations[currentLocation]['siteurl'] + "'>" + locations[currentLocation]['siteurl'] + "</a>");
                    });
                    map.setCenter(point, 13);
                    markerList.push(marker);
                    map.addOverlay(marker);
                    li = document.createElement('li');

                    li.innerHTML = "<strong>" + place.address + "</strong>";
                    li.setAttribute('onclick', 'center_on_center(' + place.Point.coordinates[1] + ',' + place.Point.coordinates[0] + ')');
                    li.setAttribute('id', 'center_');
                    li.style.fontSize = '1.4em';
                    document.getElementById('center_list').appendChild(li);
                    // alert(currentLocation) here says 0,0,0,0
                    currentLocation++;
                    // alert(currentLocation) here says 1,2,3,4
                    }
            }
    }

Прошу прощения за стену кода. Я больше не могу думать. Я понятия не имел, что это будет так сложно. Совершенно без понятия.

если я предупреждаю currentLocation в строке до того, как увеличиваю его, это всегда 0. но если я предупреждаю об этом в строке после того, как увеличиваю его, это «1,2,3,4» и т. д. Это идет вразрез со всем, что я знаю о компьютерах.