title: google map info window shows in top left corner
body: <p>When i click on a <code>marker</code>, the <code>info window</code> shows in top left corner but it should display at top of the marker.</p>
  
  <p>this is image of the situation : <a href="http://i.stack.imgur.com/GHHDE.png" rel="nofollow">http://i.stack.imgur.com/GHHDE.png</a></p>
  
  <p>this element style should be set left and top css property dynamic for every marker's infoWindow. but if you look at generated element, you see there is no left or top css property...</p>
  
  <pre><code>&lt;div class="ng-map-info-window" 
       style="cursor: default; 
              position:absolute; 
              width: 110px; 
              height: 84px;&gt;
  </code></pre>
  
  <p>any idea ?</p>
  
  <p>------ update (insert code)</p>
  
  <p>this is my angularjs controller for show and hide the info window</p>
  
  <pre><code>vm.showDetail = function (e, p) {
      vm.p = p;
      vm.map.showInfoWindow('foo-iw', p.locationId);
  };
  
  vm.hideDetail = function () {
      vm.map.hideInfoWindow('foo-iw');
  };
  </code></pre>
  
  <p>and this is my ui</p>
  
  <pre><code>&lt;marker id='{{p.locationId}}' 
                     ng-repeat="p in locations track by $index" 
                     position="[{{p.locationX}},{{p.locationY}}]" 
                     on-click="vm.showDetail(p)"&gt;
                  &lt;marker&gt;     
  &lt;info-window id="foo-iw"&gt;
             &lt;div ng-non-bindable=""&gt;
                  id: {{vm.p.locationId}}&lt;br/&gt;
                  name: {{vm.p.locationName}}&lt;br/&gt; 
                  &lt;a href="#" ng-click="vm.clicked()"&gt;Click Here&lt;/a&gt;
             &lt;/div&gt;
       &lt;/info-window&gt;
  </code></pre>