APPLICATIONS-GOOGLE-MAPS.com

Comment utiliser les API's Google Maps, tutoriels Google Maps, cartographie Google Maps

PHP ET GOOGLE MAPS

Cette application de cartographie Google Maps associée à un résultat d'interrogation d'une base de données m'a été communiquée par Ludivine L....

Dans cet exemple, il s'agit d'afficher un marqueur sur la carte pour une adresse puissée dans la base de données

<html>
  <head>
    <title>Application Google Maps : Tracer un polygone</title>
    
    <script src="http://maps.google.com/maps?file=api&v=2&key=
    ABQIAAAAFw0lDRKsdCra15LPvIxvehS3Kl_ZRrzIrsFqDz8GBXIeW1O52xQh3P31Xg2eTvqFRAyuOMY4dQrRQw"
    type="text/javascript"></script>
    //L'INTERROGATION DE LA BASE DONNÉE CE FAIT ICI
    //LE RÉSULTAT CE FERA POUR CET EXEMPLE DANS LE TABLEAU "$result_sql"
    <?
    $result_sql['adresse'] = 'Grand Place';
    $result_sql['cp'] = '7000';
    $result_sql['ville'] = 'Mons';
    ?>    
    <script type="text/javascript">//<![CDATA[
      function load()
        {
        if (GBrowserIsCompatible())
          {
          var map = new GMap2(document.getElementById("map));
          // Coordonnées de l'adresse provenant dans la base de données MySQL
          var adresse = '<?php echo $result_sql['adresse'] . ' ' . $result_sql['cp'] . ' ' . $result_sql['ville']; ?>';
          // Recherche des coordonnées d'un point dont on connait l'adresse :
          var geocoder = new google.maps.ClientGeocoder();
          geocoder.getLatLng(adresse, function (coord)
            {
            // Et centrage de la map sur les coordonnées renvoyées par Google :
            map.setCenter(coord, 15);
            // Affichage du marker
            map.addOverlay(new GMarker(coord));
            });
          // ajout de la propriété d'affichage des boutons "type de carte" (3 boutons par défaut)
          map.addControl(new GMapTypeControl());
          // ajout de la propriété ajout d'un bouton "type de carte" (Relief)
          map.addMapType(G_PHYSICAL_MAP);
          // ajout de la propriété zoom à la carte "map"
          map.addControl(new GSmallMapControl);
          }
        }
    //]]></script>
  </head>

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

Explications :

Avant le script, il faut avoir fait une réquète d'adresse dans la base de données.

Le résultat de la réquète de notre exemple serait :

Pour l'adresse : $result_sql['adresse'] = 'Grand place';

Pour le code postal : $result_sql['cp'] = '7300';

Pour la ville : $result_sql['ville'] = 'Mons';

Pour le reste du code javascript, il s'agit du géocoding d'une adresse.

Résultat :

Informations :
"Google" et "Google Maps" sont des noms déposés par la société Google, Inc. de Mountain View (Comté de Santa Clara, Californie, USA).