googlemaps api проблема с маркером кластера - PullRequest
3 голосов
/ 25 мая 2011

Я пытаюсь использовать функцию map api MarkerClusterer без удачи:

var markersArray = [];

function getMarkers(hours) {//5

    if (markersArray) {
        for (i in markersArray) {
            markersArray[i].setMap(null);
        }
        markersArray.length = 0;
    }

    image = '/images/site/tw.png';

    $.ajax({
        url: "updateMarkers",
        type:"POST",
        data:{"hours": hours},
        success: function(data){
            data = $.parseJSON( data );
            if (data.Locations.length>0) {//2
                    for (i=0; i<data.Locations.length; i++) {//1
                        loc = new google.maps.LatLng(data.Locations[i].lat, data.Locations[i].lng);

                        marker = new google.maps.Marker({
                            position: loc,
                            map: map,
                            icon: image,
                            html: content
                        });

                        markersArray.push(marker);

                        infowindow = new google.maps.InfoWindow({
                            content: "holding..."
                        });

                        google.maps.event.addListener(marker, 'click', function() {
                            infowindow.open(map, this);
                            infowindow.setContent(this.html);
                        });
                    }//1
                }//2
            }
        });

    var markerCluster = new MarkerClusterer(map, markersArray);

}//5

getMarkers(24);

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

1 Ответ

0 голосов
/ 20 июня 2011

Ajax является асинхронным. Что происходит, вы создали MarkerClusterer до завершения функции обратного вызова, и, таким образом, маркер не был помещен в глобальный массив markersArray. Это просто у меня на голове без каких-либо испытаний, но посмотрите, решит ли это проблему.

var markersArray = [], markerCluster;

function getMarkers(hours) {//5

    if (markersArray) {
        for (i in markersArray) {
            markersArray[i].setMap(null);
        }
        markersArray.length = 0;
    }

    image = '/images/site/tw.png';

    $.ajax({
        url: "updateMarkers",
        type:"POST",
        data:{"hours": hours},
        success: function(data){
            data = $.parseJSON( data );
            if (data.Locations.length>0) {//2
                    for (i=0; i<data.Locations.length; i++) {//1
                        loc = new google.maps.LatLng(data.Locations[i].lat, data.Locations[i].lng);

                        marker = new google.maps.Marker({
                            position: loc,
                            map: map,
                            icon: image,
                            html: content
                        });

                        markersArray.push(marker);

                        infowindow = new google.maps.InfoWindow({
                            content: "holding..."
                        });

                        google.maps.event.addListener(marker, 'click', function() {
                            infowindow.open(map, this);
                            infowindow.setContent(this.html);
                        });
                    }//1

                    //Create the Cluster AFTER all markers are pushed into the markersArray, and make sure it's called within the callback function
                    markerCluster = new MarkerClusterer(map, markersArray);
                }//2
            }
        });

}//5

getMarkers(24);
...