Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Change "drawingMode" in drawingManager of Google maps v3

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
        ]
    }
    });
like image 652
UserMat Avatar asked Nov 06 '13 11:11

UserMat


3 Answers

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.

like image 132
Seroczynski Avatar answered Oct 20 '22 18:10

Seroczynski


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

drawingManager.set('drawingMode');
like image 32
UserMat Avatar answered Oct 20 '22 19:10

UserMat


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?

like image 24
ArunRaj Avatar answered Oct 20 '22 17:10

ArunRaj