google maps api plugin Infobox et plusieurs marqueurs

Question

Comment puis-je créer plusieurs marqueurs avec un contenu différent lorsque vous utilisez le plugin Infobox http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/infobox-basic.html

je créais marker1 var, var marker2 etc, mais je pense que ce n'est pas la méthode vraiment agréable et je le même contenu dans tous les infowindows ...

Answer 1

Vous avez juste besoin de générer des marqueurs avec une usine de quelque sorte, par exemple:

function initMarkers(map, markerData) { 
    var newMarkers = [] 

    // Here's where all the really verbose code goes. Loop through `markerData` to 
    // create each marker. See the full code in the js fiddle 

    return newMarkers; 
} 

function initialize_google_map() { 
    //Here the call to initMarkers() is made with the necessary data for each marker. 
    //All markers are then returned as an array into the markers variable, Usually you'd 
    //get the data from server or something, here it's just shown inline. 

    var markers = initMarkers(map, [ 
     { latLng: new google.maps.LatLng(49.47216, -123.76307), address: "Address 1", state: "State 1" }, 
     { latLng: new google.maps.LatLng(49.47420, -123.75703), address: "Address 2", state: "State 2" }, 
     { latLng: new google.maps.LatLng(49.47530, -123.78040), address: "Address 3", state: "State 3" } 
    ]); 
} 

Découvrez l'exemple complet avec HTML et ainsi de suite in this jsfiddle.

Answer 2

Pour bascule Infobox onclick remplacerons:

google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
     newMarkers[i].infobox.open(theMap, this); 
     theMap.panTo(markerData[i].latLng); 
    } 
})(marker, i)); 

Par:

google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
     for (h = 0; h < newMarkers.length; h++) { 
      newMarkers[h].infobox.close(); 
     } 
     newMarkers[i].infobox.open(theMap, this); 
     theMap.panTo(markerData[i].latLng); 
    } 
})(marker, i)); 

Answer 3

@DonamiteIsTnt votre exemple est vraiment utile, mais markerData [i] ne pas la propriété latlng i pense utiliser markerData [i] .position. Cela a fonctionné pour moi.