Google Maps V3 - проблема с удалением маркеров и обновлением кластеров - PullRequest
0 голосов
/ 23 февраля 2012

Прежде всего, спасибо всем, кто вносит свой вклад в этот сайт. Я не эксперт, но я многому научился у этого сообщества:)

У меня есть карта Google с пользовательским меню, которое позволяет пользователю фильтровать категории в определенной области, добавляя маркеры на карту в зависимости от того, какие категории выбраны. Маркеры добавляются в массив, называемый «маркерами», когда они видны. Казалось, все работает нормально, но потом я добавил плагин markercluster.js, и у меня начались проблемы. Когда маркеры из категории удаляются с карты, они не удаляются из массива маркеров. Похоже, это влияет на номера кластеров, поскольку они не обновляются при удалении маркеров, а только при их добавлении.

        // The navigaiton item that has been clicked 
        $(source + ' .map-controls ul li a').live('click', function(e){
            // The category of the clicked item eg. hikes, kayaking etc
            var markerClass = $(this).attr('class');
            // If the clicked items is not visible on the map
            if(!$(this).parent().hasClass('visible')) {
                // Go through JSON to find matching categories
                for(i=0; i<category.length; i++) {
                    // If we find a match to the category of the clicked item
                    if(category[i].mapmarker == markerClass){
                        // Grab the latitude and longitude
                        var lat = category[i].lat;
                        var long = category[i].long;
                        // Create a position variable
                        var myLatlng = new google.maps.LatLng(lat,long);
                        latslongs.push(myLatlng);
                        // Create the marker
                        var marker = new google.maps.Marker({
                            position: myLatlng,
                            map: map
                        });
                        // Give the marker and id of the category clicked
                        marker.setValues({type: "point", id: markerClass});
                        // Set the category to the category clicked
                        marker.mycategory = markerClass;
                        // Push the marker to the markers array
                        markers.push(marker);           
                    }
                }
                // Marker Cluster options - Bonus point if you can tell me why opt_textColor and opt_anchor don't work?
                mcOptions = {styles: [{
                    opt_textColor: 'white',
                    height: 47,
                    url: "http://localhost/img/bgs/bg-marker-cluster.png",
                    width: 46,
                    opt_anchor: [5, 12]
                }]}
                // Set up MarkerCluster
                var markerCluster = new MarkerClusterer(map, markers, mcOptions);
                // Make the markers visible on the map
                $(this).parent().addClass('visible');

            } else {
                    // ELSE - If the clicked categories markers are visible when clicked, we go through the array of all the markers currently visible on the map
                    for (i=0; i < markers.length; i++) {
                        // If we find a match to the clicked category
                        if(markers[i].get('id') == markerClass){
                            // HERE IS WHERE I HAVE MY PROBLEM!!
                            // This line works as in it removes the correct markers from the map, but not from the markers array.
                            // I've seen suggestions of markers.lenght = 0 but I can't do that as I have others markers on the map
                            markers[i].setMap(null);
                            // I only found this out when adding the cluster plugin. Before it seemed to be working perfectly but 
                            // I had no idea the array just kept growing in size while showing/hiding different categories.
                            // I have tried so many things to try and remove the correct array items from the array, but I can't get it.
                            // The other issue is that the cluster numbers are not updating when removing categories??? But they get higher
                            // everytime you add a category. This might be a knock on effect of the ever growing markers array.
                        }
                    }
                    // Make the markers invisible on the map
                    $(this).parent().removeClass('visible');

            }
            // Thanks guys and girls.
            e.preventDefault();

        });

    },

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

Ответы [ 2 ]

0 голосов
/ 19 марта 2012

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

markers[i].setMap(null);

Я думаю, вам нужно добавить некоторую логику для удаления отдельного маркера из массива маркеров, напримерИтак:

//remove the marker from the map
markers[i].setMap(null);
//remove the marker from the array
markers.splice(i, 1);

Это, вероятно, потребует от вас управления ими в другом массиве, если вы хотите отслеживать их в памяти.

Кроме того, вы можете управлять несколькими экземплярами MarkerClusterer, по одному для каждого типа.Тогда вы можете просто позвонить

markerCluster.clearMarkers();

Bonus (opt_textColor & opt_anchor): я считаю, что ваши переменные должны быть просто "textColor" и "anchor":

  • 'styles': (объект) Объект со свойствами стиля: ...
    • 'anchor': (Array) Положение привязки текста метки.
    • 'textColor': (string) Цвет текста.
0 голосов
/ 23 февраля 2012

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

...