Google Maps

[xanthius]

Bonsoir,
désolé pour le message à une heure très tardive mais j'ai décidé de me replonger dans le code de google MAPS, code que je n'avais pas fini de modifier, je voulais rajouter des infosbulles mais n'avais pas fini par manque de résultats..
Donc en m'aidant de divers tuto j'ai pu tenter de reprendre là où je n'arrivais pas à savoir mettre en place des infosbulles à chaque marqueurs.
Le soucis actuel est que les infobulles s'affichent bien mais n'affichent que la dernière valeur de la BD voici le code :

Code PHP :

<?php

 

   while($dn1 = mysqli_fetch_array($sql))

   {    

   ?>

   

        var marqueur = new google.maps.Marker({

        position: new google.maps.LatLng(<?php echo( $dn1['lattitude']);?>, <?php echo( $dn1['longitude']);?>),

        map: carte,

        icon: "http://www.durhamcollege.ca/wp-content/uploads/campus-status-green.png" ,

        });



        var infoBulle = new google.maps.InfoWindow({

         'position' : new google.maps.LatLng(<?php echo( $dn1['lattitude']);?>, <?php echo( $dn1['longitude']);?>),           

         'content'  : 'Aeroport : <?php echo( $dn1['aeroport']);?> [<?php echo( $dn1['code']);?>]',

        });



        google.maps.event.addListener(marqueur, 'click', function() {



             infoBulle.open( carte, this);

        });

  <?php

     }

     ?>

[Prélude]

Il serait bon de regarder le code généré pour comprendre le problème : tu as x fois le même code, les mêmes variables qui sont écrasées.
Place les variable principales dans un Array.
Donc, en dehors de la boucle :

Code :

var infobulle = new Array();
var marqueur = new Array();

et dans la boucle :

Code :

infobule[id] = ...

[Xenos]

Les echo direct sont généralement le signe d'un foirage. Tu sors les données dans un code javascript, donc elles doivent être encodées pour javascript. Les echo $mesGenoux deviennent donc echo json_encode($mesGenoux);. Sur un entier, cela ne changera pas grand chose, mais je dirai que les Aeroport et code sont des chaines de caractères qui donc cassent le javascript.

Faut pas oublier que PHP est un langage de template: c'est du code qui génère du code (du HTML, du javascript, etc). Donc le code PHP doit être valide, pour générer la sortie, et le code généré (javascript) doit aussi être valide.

Après, je dirai que l'archi est à revoir, mais bon... Mieux vaut echoer les données du PHP pour les traiter dans une boucle du JS, que de faire la boucle dans le PHP.

[xanthius]

Bonjour,
voici le code généré :

Code PHP :

<?php 

    //création du marqueur

        

var marqueur = new google.maps.Marker({

        position: new google.maps.LatLng(48.06839020, -1.72642900),

        map: carte,

        icon: "http://www.durhamcollege.ca/wp-content/uploads/campus-status-green.png" ,

    });



  var infoBulle = new google.maps.InfoWindow({

    'position' : new google.maps.LatLng(48.06839020, -1.72642900),     

    'content'  : 'Aeroport : Rennes [RNS]',

  });

 



    google.maps.event.addListener(marqueur, 'click', function() {

                    infoBulle.open(carte, this);

                });

       

var marqueur = new google.maps.Marker({

        position: new google.maps.LatLng(47.15741879, -1.60623160),

        map: carte,

        icon: "http://www.durhamcollege.ca/wp-content/uploads/campus-status-green.png" ,

    });



  var infoBulle = new google.maps.InfoWindow({

    'position' : new google.maps.LatLng(47.15741879, -1.60623160),      

    'content'  : 'Aeroport : Nantes Atlantique [NTE]',

  });

 



    google.maps.event.addListener(marqueur, 'click', function() {

                    infoBulle.open(carte, this);

                }); 

[Xenos]

De mémoire & sans test:

Code PHP :

<?php 

echo "var AIRPORT_DATA = " . json_encode(mysqli_fetch_all($sql)); 

[xanthius]

De mémoire & sans test:

Code PHP :

<?php 

echo "var AIRPORT_DATA = " . json_encode(mysqli_fetch_all($sql)); 

[Xenos]

C'est exactement cela

[xanthius]

[niahoo]

Regarde le code source qui est généré, tu comprendras.

[xanthius]

J'obtient ceci :

Code PHP :

<?php 

var AIRPORT_DATA = [["resultat de la requete"]] 

 

 <script type="text/javascript">

           function initialiser() {

    var latlng = new google.maps.LatLng(46.779231, 6.659431);

    

    var options = {

        center: latlng,

        zoom: 4,

        streetViewControl: false,

        mapTypeControl:false,

        

    };

    

    var carte = new google.maps.Map(document.getElementById("carte"), options);

    

    /****************Nouveau code****************/



    //redéfinition du centre de la carte

    carte.setCenter(new google.maps.LatLng(49.00969060, 2.547924500));

    //redéfinition du zoom

    carte.setZoom(4);

    

    //création du marqueur

for (var i in AIRPORT_DATA) {

var airport = AIRPORT_DATA[i];

var marqueur = new google.maps.Marker({

       position: new google.maps.LatLng(airport.latitude, airport.longitude),

       map: carte,

       icon: "http://www.durhamcollege.ca/wp-content/uploads/campus-status-green.png" ,

   });



 var infoBulle = new google.maps.InfoWindow({

   'position' : new google.maps.LatLng(airport.latitude, airport.longitude),     

   'content'  : airport.aeroport + ' [' + airport.code + ']',

 });





   google.maps.event.addListener(marqueur, 'click', function() { infoBulle.open(carte, this); });