在谷歌地图中清除圆圈

Question

我正在尝试从地图中删除一些圆圈，但没有按预期工作。这是我的代码。

我用来画圆的函数：

for (var city in citymap) {
    var circleOptions = {
      map: GoogleMap,
      radius: distance, //In meters
      strokeColor: circleColor,
      fillOpacity: 0.0,
      strokeWeight: circleWeight,
      strokeOpacity: 0.5,
      center: citymap[city].center,
      };
    // Add the circle for this city to the map.

    cityCircle[circleId] = new google.maps.Circle(circleOptions);
}

查看 cityCircle 数组，我有 8 个元素，从 0 到 7。我尝试使用从 stackoverflow 论坛获取的以下函数删除它们：

function RemoveOverlays(overlays) {
    for (var i = 0; i < overlays.length; i++) {
        overlays[i].setMap(null);
    }

我在 else if 循环中调用函数，如下所示：

else if  (zoom <6 ){
   if (typeof cityCircle[0] !=undefined && cityCircle[0] !=null) {
    RemoveOverlays(cityCircle)
   }
}

最后，我刚刚删除了最新绘制的圆圈。我做错了什么？谢谢！

---

这是完整的代码。

// Listeners for newly created Map
google.maps.event.addListener(GoogleMap, 'center_changed', function() {
      localStorage['CenterLat'] = GoogleMap.getCenter().lat();
      localStorage['CenterLon'] = GoogleMap.getCenter().lng();
});

google.maps.event.addListener(GoogleMap, 'zoom_changed', function() {
      localStorage['ZoomLvl']  = GoogleMap.getZoom();
        var zoom = GoogleMap.getZoom(); //gets zoom level.

        if (SiteCircles && zoom >=6) {
           for (var i=0;i<SiteCirclesDistances.length;i++) {
            for (var circleId=0; circleId < size; circleId++) {
            drawCircle(marker, SiteCirclesDistances[i], circleId); // in meters
            }
           }
        } else if  (zoom <6 ){
               if (typeof cityCircle[index] !="undefined" && cityCircle.length >0) {
                RemoveOverlays(cityCircle)
                }
            }
        });

        // Add home marker if requested
    if (SiteShow && (typeof SiteLat !==  'undefined' || typeof SiteLon !==  'undefined')) {
        for (var city in citymap) {
        var siteMarker  = new google.maps.LatLng(citymap[city].SiteLat, citymap[city].SiteLon);
    var markerImage = circleImage; //Defined on config.js

                var marker = new google.maps.Marker({
            position: siteMarker,
            map: GoogleMap,
            icon: {url:markerImage, scaledSize: new google.maps.Size(32, 32)},
            title: citymap[city].title,
            zIndex: -99999
         });
    }

function drawCircle(marker, distance, circleId) {
    if (typeof distance === 'undefined') {
        return false;

        if (!(!isNaN(parseFloat(distance)) && isFinite(distance)) || distance < 0) {
            return false;
        }
    }

    distance *= 1000.0;
    if (!Metric) {
        distance *= 1.852;
    }

//Create range circles

    for (var city in citymap) {
          var circleOptions = {
          map: GoogleMap,
      radius: distance, //In meters
      strokeColor: circleColor,
      fillOpacity: 0.0,
      strokeWeight: circleWeight,
      strokeOpacity: 0.5,
      center: citymap[city].center,
      };
    // Add the circle for this city to the map.

    cityCircle[circleId] = new google.maps.Circle(circleOptions);

  }

}

Answer 1

typeof 运算符将类型转换为 String 值，因此您应该检查：

typeof cityCircle[0] != "undefined"