javascript - 删除多个圈子google maps api

Question

我正在尝试通过“zoom_change”事件删除圆圈。它会在放大时创建它们，但在缩小时不会删除它们。另一方面，标记效果很好，它们在放大时出现，在缩小时消失。谁能帮帮我？？

        function plotBusinesses() {
            var i;
            for (i = 0; i < businesses.length; i++) {
                codeBusinesses(businesses[i]);
            }
        }

        function codeBusinesses(address) {
            geocoder.geocode({'address': address[1]}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    marker = new google.maps.Marker({
                        map: map,
                        position: results[0].geometry.location,
                        icon: image,
                        title: address[0]
                    });

                    //avoiding preloading markers
                    marker.setMap(null);

                    var covered = {
                        strokeColor: '#FF0000',
                        strokeOpacity: 1,
                        strokeWeight: 0,
                        fillColor: 'green',
                        fillOpacity: 0.8,
                        //map: map,
                        center: results[0].geometry.location,
                        radius: 80
                    };


                    circleBuss = new google.maps.Circle(covered);
                    circleBuss.setMap(null);

                    google.maps.event.addListener(marker, 'click', function() {
                        infowindow.setContent(address[0]);
                        infowindow.open(map, this);
                    });
                    bounds.extend(results[0].geometry.location);

                    google.maps.event.addListener(map, 'zoom_changed', function() {
                        var zoom = map.getZoom();
                        //alert(zoom);

                        if (zoom <= 12) {
                            for (var i = 0; i < markersArray.length; i++) {
                                markersArray[i].setMap(null);
                                circleBuss[i] = new google.maps.Circle(covered);
                                circleBuss[i].setMap(null);               
                            }

                        } else {
                            //marker.setMap(map);
                            for (var i = 0; i < markersArray.length; i++) {
                                markersArray[i].setMap(map);
                                circleBuss[i] = new google.maps.Circle(covered);
                                circleBuss[i].setMap(map);
                            }
                        }
                    });
                    markersArray.push(marker);
                }
                else {
                    alert("Geocode was not successful for the following reason: " + status);
                }
                //map.fitBounds(bounds);
            });
        }

Answer 1

创建一个圆形数组并像处理标记一样对其进行迭代。

像这样

var Circles = [];

function plotBusinesses() {
    var i;
    for (i = 0; i < businesses.length; i++) {
        codeBusinesses(businesses[i]);
    }
}

function codeBusinesses(address) {
    geocoder.geocode({'address': address[1]}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location,
                icon: image,
                title: address[0]
            });

            //avoiding preloading markers
            marker.setMap(null);

            var covered = {
                strokeColor: '#FF0000',
                strokeOpacity: 1,
                strokeWeight: 0,
                fillColor: 'green',
                fillOpacity: 0.8,
                //map: map,
                center: results[0].geometry.location,
                radius: 80
            };

            Circles.push(new google.maps.Circle(covered));

            google.maps.event.addListener(marker, 'click', function() {
                infowindow.setContent(address[0]);
                infowindow.open(map, this);
            });
            bounds.extend(results[0].geometry.location);

            google.maps.event.addListener(map, 'zoom_changed', function() {
                var zoom = map.getZoom();
                //alert(zoom);

                if (zoom <= 12) {
                    for (var i = 0; i < markersArray.length; i++) {
                        markersArray[i].setMap(null);           
                    }
                    for (var i = 0; i < Circles.length; i++) {
                        Circles[i].setMap(null);
                    }
                } else {
                    //marker.setMap(map);
                    for (var i = 0; i < markersArray.length; i++) {
                        markersArray[i].setMap(map);
                    }
                    for (var i = 0; i < Circles.length; i++) {
                        Circles[i].setMap(map);
                    }
                }
            });
            markersArray.push(marker);
        }
        else {
            alert("Geocode was not successful for the following reason: " + status);
        }
        //map.fitBounds(bounds);
    });
}