afficher le resultat d'une requete sur une carte géo

17 juin 2008, 13:48

Bonjour à tous,

Voila mon problème je veux afficher plusieurs points sur une carte (ces points correspondent à des magnitudes de séismes) en fonctions des coordonnées (latitude, longitude)
ces coordonnées sont dans une base de donnée mysql
J'ai trouvé un code pour faire à peu près cela ,mais je n'ai pas su l'adapter à mon problème.
Je voudrais qu'en faisant une recherche dans un formulaire (chercher les magnitude selon certains critères) j'aie le résultat qui s'affiche sur une carte géographique.Voici le code que j'ai trouvé.
Pourriez vous m'aider c'est assez urgent,merci d'avance.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>carte d'essai</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key="
      type="text/javascript"></script>
  
  <head>
  
   
  <script type="text/javascript">

    //<![CDATA[
     function load() {
      if (GBrowserIsCompatible()) {
         
          function createMarker(point, number) {
                  var marker = new GMarker(point,icon);
                  GEvent.addListener(marker, "click", function() {
                  marker.openInfoWindowTabsHtml(infoTabs);             
                  });
                   return marker;
            }
            var infoTabs = [
             new GInfoWindowTab("  info1", "  "),
              new GInfoWindowTab(" info2", "  ")
            ];

     //création d'une carte nommé "map"
            var map = new GMap2(document.getElementById("map"));
                        GEvent.addListener(map, "moveend", function() {
        
            var center = map.getCenter();
                });
        
            map.addControl(new GSmallMapControl());
         
            map.addControl(new GMapTypeControl());
       
            
            map.setCenter(new GLatLng(45.44 , 4.395), 8);
                 
           
            var icon = new GIcon();
       
            icon.image = "http://images.google.fr/images?q=tbn:gS51abIJ6eysoM:http://rgfrance0.tripod.com/sitebuildercontent/sitebuilderpictures/flag.jpg";
       
            icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
      
            icon.iconSize = new GSize(23, 23);
            icon.shadowSize = new GSize(22, 20);
            icon.iconAnchor = new GPoint(6, 20);
            icon.infoWindowAnchor = new GPoint(5, 1);             
                
             
        
            var point = new GLatLng('<?php echo $donnees['lat']; ?>','<?php echo $donnees['lon'] ; ?>')
             map.addOverlay(createMarker(point ,1));
             marker.openInfoWindowTabsHtml(infoTabs);
           
      }
    }
   
         //]]>
        </script>
    <?php
           mysql_connect("localhost", "root", "");
           mysql_select_db("test4");
   
     //on recupere la latitude longitude nom de la structure     
          $reponse = mysql_query("SELECT lat,lon FROM seisme");
    
            while ($donnees = mysql_fetch_array($reponse)){

     
          }
      mysql_close();
       ?>  
  
  </head>
  <body onload="load()" onunload="GUnload()">
    <div id="map" style="width: 500px; height: 500px"></div>  
  </body>
</html>

17 juin 2008, 14:07

    <?php
           mysql_connect("localhost", "root", "");
           mysql_select_db("test4");
   
     //on recupere la latitude longitude nom de la structure     
          $reponse = mysql_query("SELECT lat,lon FROM seisme");
           $donnees = array();
            while ($line = mysql_fetch_array($reponse)){
                   $donnees[] = $line;
            }
      mysql_close();
      // Pour afficher le tableau pour en comprendre le contenu
      // il faut decommenter la ligne suivante.
      //var_dump($donnees);
       ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>carte d'essai</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key="
      type="text/javascript"></script>
  <head>
  <script type="text/javascript">

    //<![CDATA[
     function load() {
      if (GBrowserIsCompatible()) {
         
          function createMarker(point, number) {
                  var marker = new GMarker(point,icon);
                  GEvent.addListener(marker, "click", function() {
                  marker.openInfoWindowTabsHtml(infoTabs);             
                  });
                   return marker;
            }
            var infoTabs = [
             new GInfoWindowTab("  info1", "  "),
              new GInfoWindowTab(" info2", "  ")
            ];

     //création d'une carte nommé "map"
            var map = new GMap2(document.getElementById("map"));
                        GEvent.addListener(map, "moveend", function() {
        
            var center = map.getCenter();
                }); 

 map.addControl(new GSmallMapControl());
         
            map.addControl(new GMapTypeControl());
       
            
            map.setCenter(new GLatLng(45.44 , 4.395), 8);
                 
           
            var icon = new GIcon();
       
            icon.image = "http://images.google.fr/images?q=tbn:gS51abIJ6eysoM:http://rgfrance0.tripod.com/sitebuildercontent/sitebuilderpictures/flag.jpg";
       
            icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
      
            icon.iconSize = new GSize(23, 23);
            icon.shadowSize = new GSize(22, 20);
            icon.iconAnchor = new GPoint(6, 20);
            icon.infoWindowAnchor = new GPoint(5, 1);             
                
             
        
            var point = new GLatLng('<?php echo $donnees['lat']; ?>','<?php echo $donnees['lon'] ; ?>')
             map.addOverlay(createMarker(point ,1));
             marker.openInfoWindowTabsHtml(infoTabs);
           
      }
    }
   
         //]]>
        </script>  
  </head>
  <body onload="load()" onunload="GUnload()">
    <div id="map" style="width: 500px; height: 500px"></div>  
  </body>
</html>

17 juin 2008, 18:43

Je n'ai toujours pas de résultat, je ne comprend pas ce que vous avez changé dans mon code

17 juin 2008, 18:55

Hey

,

Tu as regardé du côté de l'API GeoCoder de Google ?

18 juin 2008, 10:01

Je n'ai toujours pas de résultat, je ne comprend pas ce que vous avez changé dans mon code

J'ai juste mis ton code en debut de page pour permettre de faire les echo dans la suite
du code HTML.
De plus j'ai rajoute dans ta boucle l'insertion des donnees dans la variable $donnees.
As tu essayer de decommenter l'affichage de var_dump ????
Si tu n'a rien dans ce tableau c'est que ta connexion vers ta base de donnees n'est pas bonne,
ou que tu fais une mauvaise requette SQL, ou qu'il n'y a pas de donnees dans ta table.

19 juin 2008, 14:34

Desolé de ne pas avoir repondu plutot ,mais voilà ce que j'ai comme resultat:

array(5) { [0]=> array(4) { [0]=> string(1) "8" ["lat"]=> string(1) "8" [1]=> string(1) "0" ["lon"]=> string(1) "0" } [1]=> array(4) { [0]=> string(2) "12" ["lat"]=> string(2) "12" [1]=> string(5) "23.05" ["lon"]=> string(5) "23.05" } [2]=> array(4) { [0]=> string(1) "5" ["lat"]=> string(1) "5" [1]=> string(3) "6.8" ["lon"]=> string(3) "6.8" } [3]=> array(4) { [0]=> string(1) "5" ["lat"]=> string(1) "5" [1]=> string(1) "5" ["lon"]=> string(1) "5" } [4]=> array(4) { [0]=> string(2) "41" ["lat"]=> string(2) "41" [1]=> string(1) "3" ["lon"]=> string(1) "3" } }
et voiçi tout mon code

<?php
           mysql_connect("localhost", "root", "");
           mysql_select_db("test4");
   
     //on recupere la latitude longitude nom de la structure     
          $reponse = mysql_query("SELECT lat,lon FROM seisme");
           $donnees = array();
            while ($line = mysql_fetch_array($reponse)){
                   $donnees[] = $line;
            }
      mysql_close();
      // Pour afficher le tableau pour en comprendre le contenu
      // il faut decommenter la ligne suivante.
      var_dump($donnees);
       ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>carte d'essai</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key="
      type="text/javascript"></script>
  <head>
  <script type="text/javascript">

    //<![CDATA[
     function load() {
      if (GBrowserIsCompatible()) {
         
          function createMarker(point, number) {
                  var marker = new GMarker(point,icon);
                  GEvent.addListener(marker, "click", function() {
                  marker.openInfoWindowTabsHtml(infoTabs);             
                  });
                   return marker;
            }
            var infoTabs = [
             new GInfoWindowTab("  info1", "  "),
              new GInfoWindowTab(" info2", "  ")
            ];

     //création d'une carte nommé "map"
            var map = new GMap2(document.getElementById("map"));
                        GEvent.addListener(map, "moveend", function() {
        
            var center = map.getCenter();
                }); 

 map.addControl(new GSmallMapControl());
         
            map.addControl(new GMapTypeControl());
       
            
            map.setCenter(new GLatLng(45.44 , 4.395), 8);
                 
           
            var icon = new GIcon();
       
            icon.image = "http://images.google.fr/images?q=tbn:gS51abIJ6eysoM:http://rgfrance0.tripod.com/sitebuildercontent/sitebuilderpictures/flag.jpg";
       
            icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
      
            icon.iconSize = new GSize(23, 23);
            icon.shadowSize = new GSize(22, 20);
            icon.iconAnchor = new GPoint(6, 20);
            icon.infoWindowAnchor = new GPoint(5, 1);             
                
             
        
            var point = new GLatLng('<?php echo $donnees['lat']; ?>','<?php echo $donnees['lon'] ; ?>')
             map.addOverlay(createMarker(point ,1));
             marker.openInfoWindowTabsHtml(infoTabs);
           
      }
    }
   
         //]]>
        </script>  
  </head>
  <body onload="load()" onunload="GUnload()">
    <div id="map" style="width: 500px; height: 500px"></div>  
  </body>
</html>
<?php echo 'Je debug ma variable : <pre>';print_r($mavar);echo '</pre>'; ?>

19 juin 2008, 15:10

var point = new GLatLng('<?php echo $donnees['lat']; ?>','<?php echo $donnees['lon'] ; ?>')

C'est mieux en changeant cette ligne par celle la ???

var point = new GLatLng('<?php echo $donnees[0]['lat']; ?>','<?php echo $donnees[0]['lon'] ; ?>')

19 juin 2008, 15:11

<?php echo 'Je debug ma variable : <pre>';print_r($mavar);echo '</pre>'; ?>

Cette ligne pour afficher les tableaux dans un style plus lisible mais dans ton cas faut
l'adapter un peu :

<?php echo 'Je debug ma variable : <pre>';print_r($donnees);echo '</pre>'; ?>

19 juin 2008, 15:20

J'ai modifié le code ,mais j'ai toujours le meme résultat

19 juin 2008, 15:26

Manque peut etre le point virgule apres la parenthese fermante :

var point = new GLatLng('<?php echo $donnees['lat']; ?>','<?php echo $donnees['lon'] ; ?>');

19 juin 2008, 15:33

non toujours la même chose.

19 juin 2008, 15:37

La je ne peux plus trop t'aider. Soit c'est un probleme de code (mais je ne trouve pas d'autre
erreurs de syntaxe ou de fonctionnement), soit c'est un probleme avec google map
que je ne connais pas. Je pense avoir donne les infos pour debugger le code PHP.
Pour ce qui est de l'API de google map, j'ai essaye de simuler ton code mais je n'ai pas les
acces a la carte que tu utilise.
Regarde dans le code source de la page HTML si tu a bien les nombres qui apparaissent
dans l'appel de la fonction var point = new GLatLng('', '');
Est tu sur qu'il faut mettre des chaines de caracteres et non pas des chiffres ?

19 juin 2008, 15:59

Merci comme même de ton aide, je vais essayé de voir si de cela que viens le probléme.

afficher le resultat d'une requete sur une carte géo

Qui est en ligne