title: Event click to rectangle on google map V3
body: <p>I have a map which users can draw some rectangles, after users draw it all rectangles they can <strong>click</strong> them to start some events, like show more information, call web services, change properties of rectangles and more.</p>
  
  <p>I need to <strong>add a click event listener</strong> to each rectangle, I tried the follow code but it didn't work. I also tried <a href="https://stackoverflow.com/questions/13907103/click-listeners-in-loop-array-and-closure#answer-13953112">this solution</a>.</p>
  
  <pre><code>function initialize() {
      var mapOptions = {
          center: new google.maps.LatLng(10.066611095611856,-69.33721108996582),
          zoom: 14,
          mapTypeId: google.maps.MapTypeId.HYBRID,
      };
      var map = new google.maps.Map(document.getElementById("map-canvas"),mapOptions);
  
  
  var drawingManager = new google.maps.drawing.DrawingManager({
        drawingControl: true,
        drawingControlOptions: {
          position: google.maps.ControlPosition.TOP_CENTER,
          drawingModes: [google.maps.drawing.OverlayType.RECTANGLE]
        },
        rectangleOptions: {
            fillColor: '#0011aa',
            fillOpacity: 1,
            strokeWeight: 5,
            clickable: false,
            editable: true,
            zIndex: 1
          }
  });
  
  drawingManager.setMap(map);
  
  google.maps.event.addListener(drawingManager, 'rectanglecomplete', function(rectangle) {
          /* DOES NOT WORK */
          google.maps.event.addListener(rectangle, 'click', function() {
              console.log(rectangle);
          });
    });
  }
  
  google.maps.event.addDomListener(window, 'load', initialize);
  </code></pre>
  
  <p>Thanks in advcance.</p>