title: How to get Google map polygon vertex point draw/pin event?
body: <p>I want to allow a user to draw polygon inside the polygon. I can get lat/long using constainsLocation function (<a href="https://developers.google.com/maps/documentation/javascript/examples/poly-containsLocation" rel="nofollow">https://developers.google.com/maps/documentation/javascript/examples/poly-containsLocation</a>) But when user draws a polygon I want to detect that the point/vertex drawn by user is inside the polygon. So there any event to detect click/draw event when user is drawing polygon?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code> 
  var map; // Global declaration of the map
     var iw = new google.maps.InfoWindow(); // Global declaration of the infowindow
     var lat_longs = new Array();
     var markers = new Array();
     var drawingManager;
     function initialize() {
       var myLatlng = new google.maps.LatLng(40.9403762, -74.1318096);
      var myOptions = {
         zoom: 13,
       center: myLatlng,
         mapTypeId: google.maps.MapTypeId.ROADMAP}
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
      drawingManager = new google.maps.drawing.DrawingManager({
      drawingMode: google.maps.drawing.OverlayType.POLYGON,
        drawingControl: true,
        drawingControlOptions: {
         position: google.maps.ControlPosition.TOP_CENTER,
       drawingModes: [google.maps.drawing.OverlayType.POLYGON]
      },
        polygonOptions: {
         editable: true
        }
     });
     drawingManager.setMap(map);
     
     google.maps.event.addListener(drawingManager, "overlaycomplete", function(event) {
      var newShape = event.overlay;
      newShape.type = event.type;
     });
  
              google.maps.event.addListener(drawingManager, "overlaycomplete", function(event){
                  overlayClickListener(event.overlay);
                  $('#vertices').val(event.overlay.getPath().getArray());
              });
          }
  function overlayClickListener(overlay) {
      alert('hello');
      google.maps.event.addListener(overlay, "mouseup", function(event){
          $('#vertices').val(overlay.getPath().getArray());
          
      });
  }
   initialize();
  
  $(function(){
      $('#save').click(function(){
          //iterate polygon vertices?
      });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://maps.google.com/maps/api/js?sensor=false&amp;libraries=drawing&amp;dummy=.js"&gt;&lt;/script&gt;
  &lt;div id="map_canvas" style="width:500px; height:450px;"&gt;&lt;/div&gt;
  &lt;form method="post" accept-charset="utf-8" id="map_form"&gt;
      &lt;input type="text" name="vertices" value="" id="vertices"  /&gt;
      &lt;input type="button" name="save" value="Save!" id="save"  /&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>When user draws first polygon than user should not be able to draw another polygon outside it. Is there any event?</p>
  
  <p>Thanks</p>