Affichage de map avec plusieurs markers et une InfoWindow par marker

**yesenia** · 18/04/2011, 22h09

Bonjour

J'ai une probleme avec la map, en fait c'est un problème classique mais je n'ai pas trouvé de ressources pour le corriger.

Ce que je voudrais affiche c'est plusieurs points avec une InfoWindow par marker.

Je ne sait pas pourquoi il affiche juste les 2 premiers adresse

Merci beaucoup

Voici le code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
 
<script type="text/javascript">
        var infoBulle = new google.maps.InfoWindow();
        var maCarte;
 
        function initialize() {
		//les options de la carte
		        var optionsCarte = {
                zoom: 6,
                center: new google.maps.LatLng(48.833,2.333),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
 
            var dataECOLE = new Array();
 
			// les 2 points qui s'affiche 
            dataECOLE[0] = new Array('Lyon', 'Centre Formation Lyon', 45.767299, 4.834329, '', '', '<p>test</p>');
            dataECOLE[1] = new Array('Marseille', 'Centre Formation Marseille', 43.297612, 5.381042, '', '', ' ');
 
			// les 2 points qui ne s'affiche pas 
            dataECOLE[3] = new Array('Paris', 'Centre Formation Paris', 48.856667, 2.350987, '', '', ' ');
			dataECOLE[4] = new Array('Bordeaux', 'Centre Formation Bordeaux', 44.837368, -0.576144, '', '', ' ');
 
 
            maCarte = new google.maps.Map(document.getElementById("laCarteECOLE"), optionsCarte);
 
            var contenue;
            var point;
            var optionsMarqueur;
            var marqueur;
 
            for (var i = 0; i < dataECOLE.length; i++) {
                point = new google.maps.LatLng(dataECOLE[i][2], dataECOLE[i][3]);
                optionsMarqueur = {
                    position: point,
                    map: maCarte,
                    title: dataECOLE[i][1]
                }
                marqueur = new google.maps.Marker(optionsMarqueur);
 
                contenue = '<div id="conteneurInfoBulle">' +
                            '<h1>' + dataECOLE[i][1] + '</h1>' +
                            '<h2>' + dataECOLE[i][4] + '</h2>' +
                            '<div id="texteInfoBulle">' +
                            '<div id="lettrineImage"><img src="' + dataECOLE[i][5] + '" title="Logo Entreprise" /></div>' +
                            dataECOLE[i][6] +
                            '</div>' +
                            '</div> ';
 
                bindInfoWindow(marqueur, contenue);
            }
        }
 
        function bindInfoWindow(marqueur, info) {
            google.maps.event.addListener(marqueur, 'click', function() {
                infoBulle.setContent(info);
                infoBulle.open(maCarte, marqueur);
            });
        }
 
 
 
    </script>

**NoSmoking** · 18/04/2011, 22h57

Bonsoir,
il t'affiche "juste les 2 premiers adresse", c'est gentil à lui
on peut lire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
...
...

~~et un peu plus loin~~

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
...
...

~~les dimensions des tableaux ne sont pas les même~~
passes par des objets cela est plus simple à écrire et à gérer

**NoSmoking** · 19/04/2011, 08h18

J'ai honte

de ce que j'ai bien pu écrire....
oubli tout ce que j'ai écrit, j'ai eu une GROSSE FATIGUE

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var dataECOLE = new Array();
// les 2 points qui s'affiche 
dataECOLE[0] = new Array('Lyon', 'Centre Formation Lyon', 45.767299, 4.834329, '', '', '<p>test</p>');
dataECOLE[1] = new Array('Marseille', 'Centre Formation Marseille', 43.297612, 5.381042, '', '', ' ');
// les 2 points qui ne s'affiche pas 
dataECOLE[3] = new Array('Paris', 'Centre Formation Paris', 48.856667, 2.350987, '', '', ' ');
dataECOLE[4] = new Array('Bordeaux', 'Centre Formation Bordeaux', 44.837368, -0.576144, '', '', ' ');

il te manque simplement le tableau d'indice [2], tu passes de 1 à 3

Pour ne pas générer d'erreur tu peux faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var ind = 0; // le compteur
var dataECOLE = new Array();
// les 2 points qui s'affiche 
dataECOLE[ind++] = new Array('Lyon', 'Centre Formation Lyon', 45.767299, 4.834329, '', '', '<p>test</p>');
dataECOLE[ind++] = new Array('Marseille', 'Centre Formation Marseille', 43.297612, 5.381042, '', '', ' ');
dataECOLE[ind++] = new Array('Paris', 'Centre Formation Paris', 48.856667, 2.350987, '', '', ' ');
dataECOLE[ind++] = new Array('Bordeaux', 'Centre Formation Bordeaux', 44.837368, -0.576144, '', '', ' ');

La remarque sur le passage par un tableau d'objet reste valable...