Look at this code: This is a Google tool that creates a panel on the map and helps us to draw shapes. By the drawingMode: google.maps.drawing.OverlayType.CIRCLE we can indicate that which tool was selected at the first load but I want to change it in the program. For example I want to change CIRCLE to POLYGON by clicking a button. How can I do something like this?

drawingManager = new google.maps.drawing.DrawingManager({
    drawingMode: google.maps.drawing.OverlayType.CIRCLE,
    drawingControl: true,
    drawingControlOptions: {
        position: google.maps.ControlPosition.TOP_CENTER,
        drawingModes: [google.maps.drawing.OverlayType.CIRCLE,
        google.maps.drawing.OverlayType.RECTANGLE,
        google.maps.drawing.OverlayType.POLYGON
        ]
    }
    });

Look at this code: This is a Google tool that creates a panel on the map and helps us to draw shapes. By the drawingMode: google.maps.drawing.OverlayType.CIRCLE we can indicate that which tool was selected at the first load but I want to change it in the program. For example I want to change CIRCLE to POLYGON by clicking a button. How can I do something like this?

drawingManager = new google.maps.drawing.DrawingManager({
    drawingMode: google.maps.drawing.OverlayType.CIRCLE,
    drawingControl: true,
    drawingControlOptions: {
        position: google.maps.ControlPosition.TOP_CENTER,
        drawingModes: [google.maps.drawing.OverlayType.CIRCLE,
        google.maps.drawing.OverlayType.RECTANGLE,
        google.maps.drawing.OverlayType.POLYGON
        ]
    }
    });

• javascript
• google-maps
• google-maps-api-3

• drawingManager.set('drawingMode'); – UserMat Commented Nov 6, 2013 at 11:42

3 Answers 3

In your case, if you would like to change the drawingMode to CIRCLE you would have to use the following JavaScript:

drawingManager.setDrawingMode(google.maps.drawing.OverlayType.CIRCLE);

This overwrite the currently used drawingMode by the one set by the above method. This follows the official Google Maps documentation.

Accepted values

google.maps.drawing.OverlayType.MARKER
google.maps.drawing.OverlayType.POLYGON
google.maps.drawing.OverlayType.POLYLINE
google.maps.drawing.OverlayType.RECTANGLE
google.maps.drawing.OverlayType.CIRCLE

Taken from source:

public final void setDrawingMode(OverlayType drawingMode)

Changes the DrawingManager 's drawing mode, which defines the type of overlay to be added on the map. Accepted values are MARKER , POLYGON , POLYLINE , RECTANGLE , CIRCLE , or null . A drawing mode of null means that the user can interact with the map as normal, and clicks do not draw anything.

This code worked for me. But I don't know if it is a standard way or no?

drawingManager.set('drawingMode');

This is my post. This will help you out. I have done it with the following. Having three methods which is used to draw three different shapes to be drawn. (initiatePolygon() , initiateRectangle() , initiateCircle() )

How to enable and disable the drawingControlOptions in Google Maps?