title: How to display infowindow from clicking link using jquery gmap3
body: <p>I am using jquery gmap3 to display a map with markers for each results found from a search I built. Each marker has a infowindow that shows details about the location the marker is on, when someone clicks the marker on the map that infowindow shows that information. Below the map I show a list of the results found, for each result found what I want to do is have a link, when someone clicks that link the page scrolls up to the map then centers to the marker that the result belongs to and the infowindow pops up automatically. Is that possible? Here is my code:</p>
  
  <pre><code>  var base_lat = 33.609063;
    var base_lon = -112.105135;
    var base_markers = [{"latLng":["33.609063","-112.105135"],"data":"&lt;div class=\"estate_info\"&gt;&lt;img src=\"\/img\/realestate\/test_estate.jpg\"&gt;&lt;b&gt;&lt;a href=\"\/charming-payette-lake-cabin-with-private-dock-beach-rl2\"&gt;1022 E. St. Mill Valley, CA 85282&lt;\/a&gt;&lt;\/b&gt;&lt;ul&gt;&lt;li&gt;&lt;label&gt;Beds:&lt;\/label&gt;6&lt;\/li&gt;&lt;li&gt;&lt;label&gt;Baths:&lt;\/label&gt;3.0&lt;\/li&gt;&lt;li&gt;&lt;label&gt;Levels:&lt;\/label&gt;2&lt;\/li&gt;&lt;\/ul&gt;&lt;ul&gt;&lt;li&gt;&lt;label&gt;Price:&lt;\/label&gt;$520,000&lt;\/li&gt;&lt;li&gt;&lt;li&gt;&lt;label&gt;Sqft:&lt;\/label&gt;5,600&lt;\/li&gt;&lt;li&gt;&lt;a href=\"\/charming-payette-lake-cabin-with-private-dock-beach-rl2\"&gt;View Details &amp;raquo;&lt;\/a&gt;&lt;\/li&gt;&lt;\/ul&gt;&lt;\/div&gt;","options":{"icon":"\/img\/markers\/number_1.png"}},{"latLng":["33.479913","-111.699535"],"data":"&lt;div class=\"estate_info\"&gt;&lt;img src=\"\/img\/realestate\/default_estate.jpg\"&gt;&lt;b&gt;&lt;a href=\"\/single-level-mountain-view-home-in-central-laveen-rl1\"&gt;South of Baseline Rd \/ 51st Ave Laveen, CA 85384&lt;\/a&gt;&lt;\/b&gt;&lt;ul&gt;&lt;li&gt;&lt;label&gt;Beds:&lt;\/label&gt;3&lt;\/li&gt;&lt;li&gt;&lt;label&gt;Baths:&lt;\/label&gt;2.5&lt;\/li&gt;&lt;li&gt;&lt;label&gt;Levels:&lt;\/label&gt;1&lt;\/li&gt;&lt;\/ul&gt;&lt;ul&gt;&lt;li&gt;&lt;label&gt;Price:&lt;\/label&gt;$124,563&lt;\/li&gt;&lt;li&gt;&lt;li&gt;&lt;label&gt;Sqft:&lt;\/label&gt;2,500&lt;\/li&gt;&lt;li&gt;&lt;a href=\"\/single-level-mountain-view-home-in-central-laveen-rl1\"&gt;View Details &amp;raquo;&lt;\/a&gt;&lt;\/li&gt;&lt;\/ul&gt;&lt;\/div&gt;","options":{"icon":"\/img\/markers\/number_2.png"}}];
  
          $('#searchmap').gmap3({
  
          map:{
  
              options:{
  
                  center:[base_lat,base_lon],
                  zoom: 9,
                  mapTypeControl: true,
                  mapTypeControlOptions: {
                    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
                  },
                  navigationControl: true,
                  scrollwheel: true,
                  streetViewControl: true
              }
  
          },
  
          marker:{
  
              values: base_markers,
  
              options:{
  
                  draggable: false
  
              },
  
              events:{
  
                  click: function(marker, event, context) {
  
                      var map = $(this).gmap3("get"),
  
                      infowindow = $(this).gmap3({get:{name:"infowindow"}});
  
                      if (infowindow) {
  
                          infowindow.open(map, marker);
                          infowindow.setContent(context.data);
  
                      }else {
  
                          $(this).gmap3({
  
                              infowindow:{
  
                                  anchor:marker,
                                  options:{content: context.data}
  
                              }
  
                          });
  
                      }
  
                  }
  
              }
  
          }
  
      });
  </code></pre>
  
  <p>Here are my results displaying under the map:</p>
  
  <pre><code>    &lt;ul&gt;
  &lt;li class="listing first"&gt;
                                         &lt;div class="rphoto"&gt;&lt;a href="#" style="background-image:url('/img/realestate/test_estate.jpg');"&gt;&lt;/a&gt;&lt;/div&gt;
                                         &lt;div class="details"&gt;
                                           &lt;strong&gt;1. &lt;a href="#"&gt;Charming Payette Lake Cabin with private dock &amp; beach&lt;/a&gt;&lt;/strong&gt;
                                           &lt;span&gt;Type: Condo | Built: 1995 | Status: Backup or Contingent&lt;/span&gt;
                                           &lt;div class="info"&gt;This charming cabin is located on Payette Lake with private dock and beach. It offers 2 Bedroom and 1 Bath. Sleeps 8 with 2 Doubles, 1 bunk and 1 queen hideabed...&lt;nav&gt;Mill Valley, CA | Price: $520,000 | &lt;a href="#"&gt;View Details &amp;raquo;&lt;/a&gt;&lt;/nav&gt;&lt;/div&gt;
                                           &lt;ol&gt;
                                             &lt;li&gt;6&lt;br&gt;Bed&lt;/li&gt;
                                             &lt;li&gt;3.0&lt;br&gt;Bath&lt;/li&gt;
                                             &lt;li class="last"&gt;5,600&lt;br&gt;Sqft&lt;/li&gt;
                                           &lt;/ol&gt;
                                         &lt;/div&gt;
                                        &lt;/li&gt;
  &lt;li class="listing last"&gt;
                                         &lt;div class="rphoto"&gt;&lt;a href="#" style="background-image:url('/img/realestate/default_estate.jpg');"&gt;&lt;/a&gt;&lt;/div&gt;
                                         &lt;div class="details"&gt;
                                           &lt;strong&gt;2. &lt;a href="#"&gt;Single-level mountain-view home in central Laveen&lt;/a&gt;&lt;/strong&gt;
                                           &lt;span&gt;Type: House | Built: 2003 | Status: Active&lt;/span&gt;
                                           &lt;div class="info"&gt;With 3,200 square feet of living area and located just one lot back from the ocean, makes childhood dreams of fantastic sandcastles come true - and you can be one of the...&lt;nav&gt;Laveen, CA | Price: $124,563 | &lt;a href="#"&gt;View Details &amp;raquo;&lt;/a&gt;&lt;/nav&gt;&lt;/div&gt;
                                           &lt;ol&gt;
                                             &lt;li&gt;3&lt;br&gt;Bed&lt;/li&gt;
                                             &lt;li&gt;2.5&lt;br&gt;Bath&lt;/li&gt;
                                             &lt;li class="last"&gt;2,500&lt;br&gt;Sqft&lt;/li&gt;
                                           &lt;/ol&gt;
                                         &lt;/div&gt;
                                        &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>So again in the search results how can I have it where if they click a link for one of the results it then centers the map where that marker is, so example the second result would center to the second marker on the map then the infowindow would automatically show. How can I do that using the jquery gmap3 code? Here is an example of what Im referring to:</p>
  
  <p><a href="http://koti.mbnet.fi/ojalesa/boundsbox/makemarker_sidebar_plain.htm" rel="nofollow">http://koti.mbnet.fi/ojalesa/boundsbox/makemarker_sidebar_plain.htm</a></p>