Search code examples
javascriptangularjsgoogle-mapsng-map

Limit the dynamic rectangle to one

In the below plunker, I can add so many polygons by selecting polygon tool. But I need to limit it to only one. After adding one polygon it should disable or the user should not be able to put another polygon on map. I have used ngMap https://ngmap.github.io/ .

Almost same replica of limit the dynamic markers to one .But I am not able to do for rectangle.

   <ng-map zoom="13" center="37.774546, -122.433523"
            map-type-id="ROADMAP"
            street-view-control-options="{position: 'LEFT_CENTER'}">
        <drawing-manager on-overlaycomplete="onMapOverlayCompleted()"
                         drawing-control-options="{{drawingControlOptions}}"
                         drawingControl="true"
                         drawingMode="null"
                         rectangleOptions="{fillColor:'red'}"
                         circleOptions="{fillColor: '#FFFF00',fillOpacity: 1,strokeWeight: 5,clickable: false,zIndex: 1,editable: true}">
        </drawing-manager>
    </ng-map>
Solution

  • Try this plunker

    if (e.type == "rectangle") {
   $scope.drawingControlOptions.drawingModes.splice(0, 1);//remove marker mode
}

    e.type is string here. and you need to remove "rectangle" from 0 th position of your array.