Ouvrir Google Maps Info Box en utilisant le lien

Question

Bon, j'espère que cela a du sens. Ci-dessous est mon code pour ma carte Google et ça marche très bien (pas le plus propre, mais ça marche). Comment pourrais-je créer un lien HTML, en dehors de la carte qui ouvrirait la boîte d'information pour moi? Par exemple, je veux être en mesure de faire:

<a href="#map" onclick="openInfo(2)">More Info</a> 

et cela ouvrirait la boîte d'information pour le marqueur 2, qui serait le mardi. J'espère que cela a du sens.

<script> 
jQuery(function($) { 
// Asynchronously Load the map API 
var script = document.createElement('script'); 
script.src = "//maps.googleapis.com/maps/api/js?sensor=true&callback=initialize&key=APIKEY"; 
document.body.appendChild(script); 
}); 
var gmarkers = []; 
function initialize() { 
var map; 
var bounds = new google.maps.LatLngBounds(); 
var mapOptions = { 
    mapTypeId: 'roadmap' 
}; 

// Display a map on the page 
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
map.setTilt(45); 

// Multiple Markers 
var markers = [ 

     ['1', LAT,LONG],  
     ['2', LAT,LONG],  

]; 


// Info Window Content 
var infoWindowContent = [ 

     ['<strong>Monday - 7:00pm</strong>'],  
     ['<strong>Tuesday - 6:00pm</strong>'], 
]; 

// Display multiple markers on a map 
var infoWindow = new google.maps.InfoWindow(), marker, i; 

// Loop through our array of markers & place each one on the map 
for(i = 0; i < markers.length; i++) { 
    var position = new google.maps.LatLng(markers[i][1], markers[i][2]); 
    bounds.extend(position); 
    marker = new google.maps.Marker({ 
     position: position, 
     map: map, 
     title: markers[i][0] 
    }); 
    // Allow each marker to have an info window  
    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
     return function() { 
      infoWindow.setContent(infoWindowContent[i][0]); 
      infoWindow.open(map, marker); 
     } 
    })(marker, i)); 

    // Automatically center the map fitting all markers on the screen 
    map.fitBounds(bounds); 
} 



// Override our map zoom level once our fitBounds function runs (Make sure it only runs once) 
var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) { 
    this.setZoom(11); 
    google.maps.event.removeListener(boundsListener); 
}); 
var opt = { minZoom: 9, maxZoom: 12 }; 
map.setOptions(opt); 

} 
</script> 

Answer 1

Vous ne devez passer votre marqueur réelle ... Vous créez vos marqueurs avec marqueur = new google.maps.Marker ({... vous devez stocker celui que vous souhaitez cibler, et passer à la fonction de déclenchement onclick