haciendo una librería para añadir graficos a google maps. Luego se canceló porque google ya trae uno propio: "drawManager"

toolsdraw.js

var ToolsDraw = (function(window, gmaps, $, undefined){
	var STATE_HAND = 'HAND',
		STATE_MARKER = '',
		STATE_LINE = '',
		STATE_POLYLINE = '',
		state,
		map,
		mapListenerInstance,
		BASE_URI_ICONMARKER = '/Images/Iconos/MapGrid/{color}.png',
		colors = [["red", "#ff0000"], ["orange", "#ff8800"], ["green", "#008000"], ["blue", "#000080"], ["purple", "#800080"]],
		colorIndex = 0
		collectionElements = new gmaps.MVCArray();

	//extendiendo la clase base Polyline de google
	gmaps.Polyline.prototype.getLength = function(){
		var path = this.getPath(),
			out = gmaps.geometry.spherical.computeLength(path);

		return out;

	}

	function getColor(isNameMode) {
		    return colors[(colorIndex++) % colors.length][isNameMode ? 0 : 1];
	}
	function startRecordHand(callbackOnCreateNew){
		state = STATE_HAND;
		
	}
	function stopRecordHand(){}

	function startRecordMarker(callbackOnCreateNew, callbackEvents){
		var color = getColor(true),
			image = BASE_URI_ICONMARKER.replace('{color}', color);

		callbackEvents = callbackEvents || {};
		state = STATE_MARKER;
		stopAll();
		mapListenerInstance = gmaps.event.addListener(map, 'click', function(e){
			stopAll();
			var marker = new gmaps.Marker({
		        position: e.latLng,
		        map: map,
		        icon: image,
		        draggable: true
		    });

		    for( eventName in callbackEvents ){
		    	if($.isFunction(callbackEvents[eventName]))
		    		gmaps.event.addListener(marker, eventName, callbackEvents[eventName]);
		    }
		    e.colorElement = color;
		    e.indexElement = collectionElements.push(marker);
		    if( callbackOnCreateNew && $.isFunction(callbackOnCreateNew) )
		    	callbackOnCreateNew(e, marker);
		});
	}
	

	function startRecordLine(callbackOnCreateNew, callbackEvents){
		state = STATE_LINE;
		callbackEvents = callbackEvents || {};

		stopAll();

		var color = getColor()
			overlay = new gmaps.Polyline({
				editable:true, 
				map:map, 
				strokeColor:color,
				path:[]
			}),
			index = collectionElements.push(overlay);

		mapListenerInstance = gmaps.event.addListener(map, 'click', function(e){
			overlay.getPath().push( e.latLng );
			if( callbackEvents['addpoint'] && $.isFunction( callbackEvents['addpoint'] ) )
				callbackEvents['addpoint'](e, overlay);
		});

		for( eventName in callbackEvents ){
			
		    if((eventName !== 'addpoint') && $.isFunction(callbackEvents[eventName])){
		    	gmaps.event.addListener(overlay, eventName, callbackEvents[eventName]);
		    }
		    	
		}

		if(callbackOnCreateNew && $.isFunction(callbackOnCreateNew) )
		    callbackOnCreateNew({
		    	colorElement:color,
		    	indexElement:index
		    }, overlay);
		
	}
	function stopRecordLine(){}

	function startRecordPolyLine(){
		state = STATE_POLYLINE;
	}
	function stopRecordPolyLine(){}


	function stopAll(){
		if(mapListenerInstance)
			gmaps.event.removeListener(mapListenerInstance);
	}

	return function(_map){
		map = _map;
		return {
			hand:startRecordHand,
			marker:startRecordMarker,
			line:startRecordLine
		}
	}

})(window, google.maps, jQuery)