L'ajout de Tableau de Marqueurs dans Google Map

J'ai besoin d'aide en créant un tableau de marqueurs dans la Carte de Google, de sorte qu'il peut être plus efficace, au lieu de créer un marqueur, un par un. J'ai essayé ce qui suit, mais ça ne fonctionne pas. Quelqu'un a des conseils?

//create array to store a set of location
var collection = new Array();

//a set of locations stored in array
collection[0] = new google.maps.LatLng(13.742167701649997, 100.50721049308777);
collection[1] = new google.maps.LatLng(13.74428, 100.5404525);
collection[2] = new google.maps.LatLng(13.744108, 100.543098);

var pointMarkerImage = new Array();//store image of marker in array
var pointMarker = new Array();//store marker in array

//create number of markers based on collection.length
function setPoint(){
for(var i=0; i<collection.length; i++){

var pointMarkerImage[i] = new google.maps.MarkerImage('marker.png');
var pointMarker[i] = new google.maps.Marker({
        position: collection[i],
        map: map,
        icon: pointMarkerImage[i],
        animation: google.maps.Animation.BOUNCE,
        title: "collection"+ i 
    });

    google.maps.event.addListener(pointMarker[i], 'click', function()    { 
             window.open("blog/page01.html","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=yes, copyhistory=yes")
             };
    );
    }
}
êtes-vous sûr que vous êtes en invoquant setPoint()? D'où appelez-vous cette fonction?
havent vous pensé à une boucle for, vous n'avez pas besoin de créer un nouveau latlng objet pour chaque index de tableau, vous pouvez simplement enregistrer le numéro et le faire pour(typique){ google.carte.(lat[i])} quelque chose comme ça
merci pour vos commentaires, j'ai peut-être besoin de poster tout le code, afin de donner un look ci-dessous..

OriginalL'auteur user2192094 | 2013-03-20

  1. 29

    C'est mon simple code et il fonctionne très bien. Lorsque vous cliquez sur un marqueur, il va ouvrir la Fenêtre d'informations basées respectivement sur que marqueur d'emplacement.

    <script>
var locations = [
['Title A', 3.180967,101.715546, 1],
['Title B', 3.200848,101.616669, 2],
['Title C', 3.147372,101.597443, 3],
['Title D', 3.19125,101.710052, 4]
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: new google.maps.LatLng(3.171368,101.653404),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow;
var marker, i;
for (i = 0; i < locations.length; i++) {  
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
<div data-role="page" id="map_result">
<div data-role="header" data-position="fixed"><h1>Multiple Marker</h1></div>
<div data-role="content" style="padding:0;">
<div id="map"></div>
</div>
</div>
    Cette fonction(i) de retour de la fonction de chose est très chouette.

    OriginalL'auteur Qiqi Abaziz

  2. 3

    Je vois que peu de choses:

    1) dans la boucle for, var pointM... faut juste être pointM... ajoutant le var, fait-il ignorer le jeu que vous avez à l'extérieur de la boucle for.

    2) vous avez un ; après une fonction qui est la rupture des choses.

    Essayez ceci:

    //create array to store a set of location
var collection = new Array();
//a set of locations stored in array
collection[0] = new google.maps.LatLng(13.742167701649997, 100.50721049308777);
collection[1] = new google.maps.LatLng(13.74428, 100.5404525);
collection[2] = new google.maps.LatLng(13.744108, 100.543098);
var pointMarkerImage = new Array();//store image of marker in array
var pointMarker = new Array();//store marker in array
//create number of markers based on collection.length
function setPoint(){
for(var i=0; i<collection.length; i++){
pointMarkerImage[i] = new google.maps.MarkerImage('marker.png');
pointMarker[i] = new google.maps.Marker({
position: collection[i],
map: map,
icon: pointMarkerImage[i],
animation: google.maps.Animation.BOUNCE,
title: "collection"+ i 
});
google.maps.event.addListener(pointMarker[i], 'click', function(){
window.open("blog/page01.html","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=yes, copyhistory=yes");
}
);
}
}
    Merci pour vos commentaires. C'était une faute d'inattention! Je ne sais pas pourquoi il ne fonctionne toujours pas. je pourrais avoir besoin de poster tout le code ci-dessous pour donner une meilleure image.

    OriginalL'auteur Dawson Loudon

  3. 0

    J'ai copié M. Qiqi Abaziz et amélioré un peu. C'est la version complète

    <script type="text/javascript">
function initMap() {
var locations = [
['Title A', 3.180967,101.715546],
['Title B', 3.200848,101.616669],
['Title C', 3.147372,101.597443],
['Title D', 3.19125,101.710052]
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: new google.maps.LatLng(3.171368,101.653404),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow;
var marker, i;
for (i = 0; i < locations.length; i++) {  
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?v=3.exp&key=YOURAPIKEY=initMap">
</script>
<style type="text/css">
#map { height: 400px;
margin-left:auto;
margin-right:auto;
text-align:left;
width: 80%;}
</style>
<div id="map"></div>

    OriginalL'auteur Ryosuke Hujisawa