title: Open InfoWindow with After click on Link, Google Maps API
body: <p>I've read a bunch of the posts on here but can't seem to figure out what I'm doing wrong. Any advice on how to add a link than opens the infowindow from outside of the google map?</p>
  
  <p>I have tried......</p>
  
  <pre><code>&lt;a href="javascript:google.maps.event.trigger(gmarkers[0],'click');"&gt;Open Info Window&lt;/a&gt;
  </code></pre>
  
  <p>and </p>
  
  <pre><code>function infoOpen(i) {google.maps.event.trigger(gmarkers[i], 'click');}
  </code></pre>
  
  <p>But no luck!!</p>
  
  <pre><code>var locations = [
      &lt;?php  $i = 1; while ( have_posts() ) : the_post(); ?&gt;
          &lt;?php if ( get_geocode_latlng($post-&gt;ID) !== '' ) : ?&gt;
              {
                  latlng : new google.maps.LatLng&lt;?php echo get_geocode_latlng($post-&gt;ID); ?&gt;,
                  info : $('#item&lt;?php echo $i; ?&gt;').clone().get(0),
  
          },
          &lt;?php endif; ?&gt;
      &lt;?php $i++; endwhile; ?&gt;
  ];
  
  
  // Enable the visual refresh
  google.maps.visualRefresh = true;
  var number = '1';
  var infowindow = new google.maps.InfoWindow({maxWidth: 200});
  var iconBase = 'https://chart.googleapis.com/chart?chst=d_map_pin_letter&amp;chld='+number+'|F2A327|000000';
  /* var iconBase = 'http://www.google.com/mapfiles/marker'+number+'.png'; */
  var shadow = new google.maps.MarkerImage('/wp-content/themes/digimix/shadow.png', new google.maps.Size(37, 34) );
  
  
  function initialize() {
  map = new google.maps.Map(document.getElementById('map'), {
      zoom: 4,
      minZoom: 4,
      maxZoom: 18,
      center: new google.maps.LatLng(41.4758162, -71.29734339999999),
      mapTypeControl: true,
  mapTypeControlOptions: {
    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
  },
      panControl: false,
      scaleControl: false,
      zoomControl: true,
      zoomControlOptions: {
      style: google.maps.ZoomControlStyle.LARGE
  },
      mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  
  //create empty LatLngBounds object
  var bounds = new google.maps.LatLngBounds();
  
  //when infowindow is open, close info window when you click on the map
  google.maps.event.addListener(map, 'click', function() {
      infowindow.close();
  });
  
  for (var i = 0; i &lt; locations.length; i++) {
      var marker = new google.maps.Marker({
          position: locations[i].latlng,
          icon: 'https://chart.googleapis.com/chart?chst=d_map_pin_letter&amp;chld='+(i+1)+'|F2A327|000000',
          title: "Click for more information",
          shadow: shadow,
          map: map,
      });
  
  
      //extend the bounds to include each marker's position
      bounds.extend(marker.position);
  
  
      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i].info);
          infowindow.open(map, marker);
        }
      })(marker, i));
  }
  
      //now fit the map to the newly inclusive bounds
  map.fitBounds(bounds);}
  </code></pre>