Google maps, php, mysql

**costiflex** · 03/10/2016, 09h41

Bonjour à tous,

je tente de mettre une google maps sur mon site avec des marqueurs enregistrés dans une BDD.

pour cela, j ai tenté de suivre ce tuto : https://developers.google.com/maps/a.../phpsqlajax_v3

Ma carte s'affiche mais pas les marqueurs qui vont avec :-/

J'ai créé 3 fichiers :

connect.php

Code php :

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

1
2
3
4
5
6
 
<?php
$username="root";
$password="";
$database="data_marker";
?>

show_map.php

Code html :

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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
 
<!DOCTYPE html >
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>PHP/MySQL & Google Maps Example</title>
    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"
            type="text/javascript"></script>
    <script type="text/javascript">
    //<![CDATA[
 
    var customIcons = {
      restaurant: {
        icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png'
      },
      bar: {
        icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png'
      }
    };
 
    function load() {
      var map = new google.maps.Map(document.getElementById("map"), {
        center: new google.maps.LatLng(47.6145, -122.3418),
        zoom: 13,
        mapTypeId: 'roadmap'
      });
      var infoWindow = new google.maps.InfoWindow;
 
      // Change this depending on the name of your PHP file
      downloadUrl("phpsqlajax_genxml.php", function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
          var name = markers[i].getAttribute("name");
          var address = markers[i].getAttribute("address");
          var type = markers[i].getAttribute("type");
          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
          var html = "<b>" + name + "</b> <br/>" + address;
          var icon = customIcons[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon
          });
          bindInfoWindow(marker, map, infoWindow, html);
        }
      });
    }
 
    function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
    }
 
    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;
 
      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };
 
      request.open('GET', url, true);
      request.send(null);
    }
 
    function doNothing() {}
 
    //]]>
 
  </script>
 
  </head>
 
  <body onload="load()">
    <div id="map" style="width: 500px; height: 300px"></div>
  </body>
 
</html>

et phpsqlajax_genxml.php

Code php :

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
 
 
<?php
 
require("connect.php");
 
// Start XML file, create parent node
 
$dom = new DOMDocument("1.0");
$node = $dom->createElement("markers");
$parnode = $dom->appendChild($node);
 
// Opens a connection to a MySQL server
 
$connection=mysql_connect ('localhost', $username, $password);
if (!$connection) {  die('Not connected : ' . mysql_error());}
 
// Set the active MySQL database
 
$db_selected = mysql_select_db($database, $connection);
if (!$db_selected) {
  die ('Can\'t use db : ' . mysql_error());
}
 
// Select all the rows in the markers table
 
$query = "SELECT * FROM markers WHERE 1";
$result = mysql_query($query);
if (!$result) {
  die('Invalid query: ' . mysql_error());
}
 
header("Content-type: text/xml");
 
// Iterate through the rows, adding XML nodes for each
 
while ($row = @mysql_fetch_assoc($result)){
  // ADD TO XML DOCUMENT NODE
  $node = $dom->createElement("marker");
  $newnode = $parnode->appendChild($node);
  $newnode->setAttribute("name",$row['name']);
  $newnode->setAttribute("address", $row['address']);
  $newnode->setAttribute("lat", $row['lat']);
  $newnode->setAttribute("lng", $row['lng']);
  $newnode->setAttribute("type", $row['type']);
}
 
echo $dom->saveXML();
 
?>

J avoue que je ne vois pas où ça bloque :-/

Avez vous déjà été dans le meme cas ?

Si vous avez des pistes n'hésitez pas !

Merci !!!

**Celira** · 03/10/2016, 11h04

Hum... A-tu essayé de faire fonctionner ton fichier phpsqlajax_genxml.php seul ? pour vérifier si il récupère bien des données ?
Parce que j'ai un sérieux doute sur la requête $query = "SELECT * FROM markers WHERE 1";.
Tu peux aussi vérifier la réponse à l'appel AJAX en utilisant les DevTools de ton navigateur (Un exemple ici avec Firebug dans Firefox : V-B. Les requêtes XMLHTTP à la loupe, mais les DevTools natifs de Firefox et de Chrome, voire d'IE si tu travailles avec une version récente ou d'Edge, sont très bien l'affaire)

Au passage, l'API mysql (les fonctions mysql_xxxx) est obsolète depuis PHP 5.5 et supprimée en PHP 7. Il serait judicieux d'envisager de migrer à mysqli ou PDO.

**costiflex** · 03/10/2016, 11h23

Bonjour Celira,

Merci pour ta réponse aussi rapide !

En effet, je n'avais pas pensé à tester avec ce genre d'outil (c est la première fois que je travaille avec ces types de fichier (ajax, xml ...).

Je vais regarder ça et je vous tiens au courant !

Encore Merci !

D'acc, je prends note pour mysqli et PDO

**costiflex** · 15/10/2016, 18h32

j avoue que je ne comprends pas pourquoi je n'ai pas le meme resultat que ce tuto alors que j ai l impression de l'avoir suivi à la lettre ...

https://developers.google.com/maps/a.../phpsqlajax_v3

avez vous des conseils ?

Merci

Google maps, php, mysql

PHP & Base de données

Discussions similaires

Partager

Partager