I am looking at creating an online form that includes a map (google or something similar) where the user can draw a poly and when the user hits submit, i get all the info plus a shapefile or kmz of the area drawn, have been looking for various solutions to this and not getting very far.


This is a link to Google's documentation on how to allow users to draw polygons and other shapes on a map:


The basic steps are:

  1. Add a drawing tool to the map.


  1. Add a listener event for when the user completes the shape:

When a shape overlay is created, two events are fired: •An {overlay}complete event (where {overlay} represents the overlay type, such as circlecomplete, polygoncomplete, etc). A reference to the overlay is passed as an argument. •An overlaycomplete event. An object literal, containing the OverlayType and a reference to the overlay, is passed as an argument.

  1. Get the coordinates of the polygon.

Here's a code example from another stackoverflow answer on how to get the coordinates of the polygon:

google.maps.event.addListener(drawingManager, 'polygoncomplete', function (polygon) {
    var coordinates = (polygon.getPath().getArray());


The Google Maps API reference documentation can be found here:



Not the answer you're looking for? Browse other questions tagged or ask your own question.