在谷歌地图中清除圆圈

时间:2014-01-30 16:32:42

标签: javascript google-maps maps

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

我曾经用过绘制圆圈的功能:

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);

  }

}

1 个答案:

答案 0 :(得分:0)

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

typeof cityCircle[0] != "undefined"