Карты Google — загрузка маркеров — фильтр с помощью markercluster

#javascript #jquery #ajax #google-maps

#javascript #jquery #ajax #google-карты

Вопрос:

Я хотел бы попросить вас о помощи с моим кодом. У меня есть скрипт, в котором я загружаю и обрабатываю файл json через $ .ajax. При фильтрации я также использую функцию moveToLocation() . который работает хорошо, но плохо работает с markerclsuter, потому что мои точки после масштабирования все еще «кластеризованы».

 function moveToLocation(lat, lng, zoom){
    var center = new google.maps.LatLng(lat, lng);
    map.panTo(center);
    map.setZoom(zoom);
}

function addMarkers(v_data) {

        if(v_data!= null){
            removeMarkers();
        }

        $.ajax({ 
            type: 'POST', 
            url: 'get-places-v3.php', 
            data: {data : JSON.stringify(v_data)},
            dataType: 'json',
            success: function (data) { 

                //initialize(data.regionGps[0].lat, data.regionGps[0].lng, data.regionGps[0].zoom);
                console.log(data.regionGps[0].lat   ' '   data.regionGps[0].lng);
                moveToLocation( data.regionGps[0].lat, data.regionGps[0].lng, data.regionGps[0].zoom );

                //console.log(data.regionGps[0].lat);

                $.each(data.locations, function(index, element) {

                    var latLng = new google.maps.LatLng(element.lat, element.lng);

                    var marker = new google.maps.Marker({
                        position: latLng,
                        map: map,
                        // icon: icon,
                        title: element.name
                    });
                    markers.push(marker);
                    var details = '<strong>'   element.name   '</strong><br>'    element.adress;

                    bindInfoWindow(marker, map, infowindow, details);

                });
                markerCluster = new MarkerClusterer(map, markers, {
                    imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
                });
            }
        }); 
}
 

Итак, я хотел бы помочь с 2 проблемами:

1) Как я описал выше, мне нужно «отменить» кластер после использования фильтра (но если я выберу регион 0, мне нужно «повторно активировать» кластер)

2) Я не знаю почему, но функция «movetolocation» работает только в первый раз после повторного использования. не работает.

Вот рабочий пример: https://ugh.beladzi.cz/show-data-places-v3.php (Я не знаю, как я могу импортировать json в codepen или jsfiddle).

Большое спасибо за вашу помощь

Ответ №1:

При использовании маркеров и MarkerCluster вам необходимо убедиться, что и массив маркеров, и объект MarkerCluster доступны для других функций, в которых вы хотели бы их изменить. Всякий раз, когда вы вызываете свою функцию нажатия кнопки, вам нужно проверить, является ли она регионом 0 или нет. Если это не вызов региона 0 markerCluster.clearMarkers() , а вызов региона 0 markerCluster.addMarkers(markers)

Вот справочный документ для marker clusterer

https://googlemaps.github.io/js-marker-clusterer/docs/reference.html

Я не мог бы сказать вам, почему ваши функции panTo или setZoom не работают, не увидев больше кода.

Комментарии:

1. Я подготовил пример jsfiddle . Могу я спросить вас, что вы имеете в виду? Спасибо!