Показать / скрыть маркеры в Google Maps с помощью Javascript - PullRequest
0 голосов
/ 05 декабря 2018

У меня есть карта с 2 типами маркеров, и до сих пор я предоставлял 2 флажка, которые давали возможность отображать / скрывать эти маркеры с этим кодом:

Флажки

<input type="checkbox" id="suggested" name="suggested" onclick="toggleMarkers('suggested')">
<label for="suggested"> Suggested</label>
<input type="checkbox" id="organized" name="organized" onclick="toggleMarkers('organized')">
<label for="organized"> Organized</label>

Javascript

function toggleMarkers(type) {
    switch(type)
    {
        case 'suggested':
            for (var i = 0; i < suggested.length; i++) {
                if (suggested[i].getMap() === null) {
                    suggested[i].setMap(map);
                } else {
                    suggested[i].setMap(null);
                }
            }
            break;

        case 'organized':
            for (var i = 0; i < organized.length; i++) {
                if (organized[i].getMap() === null) {
                    organized[i].setMap(map);
                } else {
                    organized[i].setMap(null);
                }
            }
            break;

        default: break;
    }
}

, где suggested и organized - это 2 массива, содержащие маркеры соответствующего типа.Теперь я заметил, что со многими маркерами этого недостаточно, и карта может сбивать с толку, тогда я решил представить markercluster.Я мог бы сделать это, достаточно было импортировать библиотеку и добавить

let suggestedCluster = new MarkerClusterer(map, suggested, {gridSize:80, styles:styles[0]});

let organizedCluster = new MarkerClusterer(map, organized, {gridSize:80, styles:styles[1]});

Проблема в том, что я хочу оставить функциональность, чтобы показать / скрыть категорию маркеров, но приведенного выше кода больше нетхорошо для этого, у него неправильное поведение.Как я могу показать / скрыть категорию кластеров, а также маркеры той же категории, которые не включены в кластер?

1 Ответ

0 голосов
/ 05 декабря 2018

Согласно ссылка , MarkerClusterer имеет методы addMarkers и clearMarkers.

function toggleClusterer(type){
    switch(type)
    {
        case 'suggested':
            toggle(suggestedCluster, suggested);
            break;

        case 'organized':
            toggle(organizedCluster, organized);
            break;
    }

    function toggle(clusterer, markers) {
        if(clusterer.getMarkers().length == 0){
            clusterer.addMarkers(markers);
        } else {
            clusterer.clearMarkers();
        }
    }
}
...