Маркеры отображаются более одного раза - PullRequest
0 голосов
/ 10 декабря 2011

Я реализовал Google Maps v3, он обновляется во время события bounds_changed, но проблема в том, что когда событие срабатывает, он отображает маркеры несколько раз, любые предложения.

Я добавил создателей в менеджер маркеров.

        var map = null;
        var myLatLng = null;
        var sidebarHtml = "";
        var infowindow = infowindow = new google.maps.InfoWindow({});;
        var mgr = null;
        var currentBounds = null;
        var xml = null;
        var markers = null;
        var markersArray = [];

        var customIcons =  {
            restaurant: {
                icon: 'images/icon_01.png'
            },
            bar: {
                icon: 'images/icon_02.png'
            }
        }

        function load() {
            var myOptions = ({
                center: new google.maps.LatLng(47.6145, -122.3418),
                zoom: 13,
                mapTypeId: 'roadmap'
            });
            map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);
            mgr = new MarkerManager(map, {fitBounds: true});

            google.maps.event.addListener(map, 'bounds_changed', downloadUrl);
        }

        function downloadUrl() {                
            var request = window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest;
            var params = "";
            var url = "phpmysqlajax_genxml.php";

            request.onreadystatechange = function() {
                if(request.readyState == 4) {
                    //alert(request.responseXML);
                    useTheData(request);
                }
            };

            request.open("GET", url + params, true);
            request.send(null);
        }

        function useTheData(data) {
            currentBounds = map.getBounds();
            xml = data.responseXML;
            markers = xml.documentElement.getElementsByTagName("marker");
            mgr.clearMarkers();

            if (!currentBounds) currentBounds = new google.maps.LatLngBounds();

            sidebarHtml = '<ul class="sidebar">';

            for(var i = 0; i < markers.length; i++) {

                var name = markers[i].getAttribute("name");
                var address = markers[i].getAttribute("address");
                var lat = parseFloat(markers[i].getAttribute("lat"));
                var lng = parseFloat(markers[i].getAttribute("lng"));
                var type = markers[i].getAttribute("type");
                var latlng = new google.maps.LatLng(lat, lng);

                if (currentBounds.contains(latlng)) {
                    attachMarker( name, address, latlng, type );
                    markerSidebarEntry(i);
                }
            }

            sidebarHtml += "</ul>";

            document.getElementById("sidebar").innerHTML = sidebarHtml;
        };

        function attachMarker( name, address, latlng, type ) {

            var marker = new google.maps.Marker({
                position : latlng,
                map: map,
                icon     : customIcons[type].icon
            });
            mgr.addMarker(marker, 5);

            markersArray.push(marker);

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

            // add marker here.
        }

        function markerSidebarEntry(i) {
             var name = markers[i].getAttribute("name");

             sidebarHtml += '<li class="' + markers[i].getAttribute("type") + '"><a href="javascript:markerClick(' + i + ');">' + name + '</a></li>';
        }

        function markerClick(i) {
            google.maps.event.trigger(markersArray[i], "click");
        }

1 Ответ

0 голосов
/ 11 декабря 2011

Это может быть просто ошибка копирования-вставки, но этот код кажется неправильным (двойное объявление 'infowindow' и дублирование; в конце):

var infowindow = infowindow = new google.maps.InfoWindow({});;

Также здесь вы надеваетеВам не нужно (), окружающее {}

var myOptions = ({
                center: new google.maps.LatLng(47.6145, -122.3418),
                zoom: 13,
                mapTypeId: 'roadmap'
            });

. Предложите запустить код JS через что-то вроде JSLint .

.
...