Google Maps v3: Markerclusterer не увольняют?

Question

У меня на руках немного головоломки.Я использую Google Maps v3 и MarkerClusterer v3.Когда я загружаю свою страницу, появляется карта, все точки есть, но ничего не кластеризовано.

Если я иду к консоли Firebug и выполняю:

markerCluster = new MarkerClusterer(map, markers);

Внезапная кластеризация работает.

Странно, если я помещу предупреждение между экземпляром карты и экземпляром markerclusterer, снова кластеризация внезапно работает.Вот конец моей функции $ (document) .ready:

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    markerCluster = new MarkerClusterer(map, markers);

, и все, что нужно для работы кластеризации:

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    alert("test");
    markerCluster = new MarkerClusterer(map, markers);

Что мне здесь не хватает?Нужно ли как-нибудь обновить карту?Это то, что происходит с окном оповещения?

Если вам нужно больше кода, напишите мне комментарий.

Answer 1

Ваша проблема связана с тем, что $.ajax(), $.getJSON() являются асинхронными методами. После выполнения ваш код не блокируется (в противном случае браузер также будет заблокирован). Следовательно, var markerCluster = new MarkerClusterer(map, markers); вызывается до окончания обработки ответа AJAX. Чтобы решить эту проблему, вы должны использовать обратный вызов, такой как complete(), который запускается после завершения обработки.

Например:

$.getJSON('/your_data.json', function(data) {
  for (var i=0;i<data.length;i++){
    // code to display markers
  }
}).complete(function() { 
  var marker_cluster = new MarkerClusterer(map, gmarkers);
}); 

Надеюсь, это поможет.

Answer 2

Вот слегка отредактированная версия того, что я в конечном итоге использовал.Я даю здесь большую часть сценария, чтобы люди могли понять контекст, в котором происходит каждая функция, а также объем всего.Надеюсь, это спасет кого-то от царапин на голове.

var initialize = function(){

    var markers = [];
    var infowindow = new google.maps.InfoWindow();

    function load_content(marker, id){
        $.ajax({
            url: 'eventos/' + id,
            success: function(data){
                infowindow.setContent(data);
                infowindow.open(map, marker);
            }
        });
    }

    var opt = { ...options...}

    var map = new google.maps.Map(document.getElementById('map_canvas'), opt);

    map.setCenter(new google.maps.LatLng(-44.4419, 170.1419));
    map.setZoom(9);

    $.ajax({
        url: 'eventos/',
        method: 'GET',
        dataType: 'json',
        success: function(data){

            $.each(data, function(i, a){

                var latlng = new google.maps.LatLng(a.evento.lat, a.evento.lng);

                var marker = new google.maps.Marker({
                    position : latlng,
                    title: a.evento.title
                });

                google.maps.event.addListener(marker, 'closeclick', function() {
                    infowindow.setContent("");
                });

                google.maps.event.addListener(marker, 'click', function() {

                    infowindow.close();

                    infowindow.setContent("<img src='loading.gif'>");

                    load_content(marker, a.evento.id);
                });

                markers.push(marker);
            });

            var markerCluster = new MarkerClusterer(map, markers);

        }

    });

};

Answer 3

У меня была точно такая же проблема и симптомы.В итоге я решил загрузить карту с помощью загрузчика Google, который по какой-то причине работал нормально.

Это не работает с mapclusterer:

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
...
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

Пока это работает:

<script src="http://www.google.com/jsapi"></script>
...
google.load('maps', '3', { other_params: 'sensor=false' });
google.setOnLoadCallback(initialize);

function initalize() {
    var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
}

Этот обходной путь может быть невозможен не для всех, но, надеюсь, кто-то может извлечь из этого пользу.

Answer 4

Вы проверяли эту тему на MarkerClusterer v3 ? Там есть несколько ссылок на некоторые полезные ресурсы, а именно примеры кода и справочные документы.

Проверьте примеры и убедитесь, что они работают нормально в вашем тестовом браузере (вы никогда не знали, что это может быть проблемой с MC).