When we launched the map editing tools in Google Maps, the reaction of developers was "This is cool, but how can I use it on my own site?" As someone who was originally drawn to Google in part because of the Maps API and the great developer community around it, I committed to making the My Maps tools useful for developers on their own sites.
Today, I'm pleased to announce that our user interface functionality for editable polylines and polygons is now part of the Maps API.
Say, for example, that you have a
GPolygon you want users to be able to edit. Simply call
GPolygon.enableEditing() and the poly will have draggable edit control vertices when the user mouses over it. To later make it non-editable, call
We've also exposed additional events for
GPolyline so that you can easily mimic the MyMaps behavior (in mashups or Mapplets) by calling
enableEditing on "mouseover" and
disableEditing on "mouseout". To find out when the user makes an edit, listen for the "lineupdated" event. And if you want users to be able to draw a new
GPolyline completely from scratch, just use
enableDrawing as shown below:
var polyline = new GPolyline(); map.addOverlay(polyline); polyline.enableDrawing();
Every click on the map will add a new vertex to the polyline until the user double-clicks or clicks again on the last vertex. You can also call
enableDrawing to lets users append vertices to either end of an existing polyline. And just because everyone likes pretty colors, we exposed methods to let you change the style of a polyline or polygon:
setFillStyle. Have fun, and let us know what you think in the forum.