Discussion :

[Mrzikel]

Bonjour tout le monde,

J'ai vraiment besoin d'un coup de main pour utiliser l'api google map et afficher les points de rep�res dit markers provenant de ma base de donn�e ex�cut� par mysqli dont la requ�te est la suivante :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
<?php
require("connect_inc.php");
$req = mysqli_query($db, "SELECT pseudo, latitude_p, longitude_p FROM trip_cal_depart WHERE latitude_p!='' AND longitude_p!='' AND pseudo='castor'");
while($row = mysqli_fetch_array($req, MYSQLI_ASSOC))
        {
        $retour = json_encode($row);// On transforme le tableau PHP en json
        // On retourne le tableau à la fonction appelante
        echo $retour; 
        }
 ?>

J'obtiens bien une r�ponse en JSON qui est la suivante (par exemple):

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
{"pseudo":"Castor","latitude_p":"59.9138688","longitude_p":"4.8036921"}
{"pseudo":"Castor","latitude_p":"50.6313687","longitude_p":"5.7356349"}

Je traite le tout � partir d'une requ�te AJAX faite en JQUERY pour r�cup�rer le r�sultat et l'afficher sur google map en ex�cutant une boucle FOR mais j'ai comme l'impression que la boucle ne veut pas fonctionner,, voici mon 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
var lat = 48.852969;
var lon = 2.349903;
var map = null;
function initMap() {
	map = new google.maps.Map(document.getElementById("map"), {
		center: new google.maps.LatLng(lat, lon),
		zoom: 4,
		navigationControl: true,
			navigationControlOptions: {
			style: google.maps.NavigationControlStyle.ZOOM_PAN
		}
	});
	// Nous appelons la fonction ajax de jQuery
	$.ajax({
		// On pointe vers le fichier data_adresse.php
		url : "data_adresse.php",
		dataType : "json",
	}).done(function(json)
	{
 
		// Si on obtient une réponse, elle est stockée dans la variable json
		// On construit l'objet villes à partir de la variable json
 
		 var tabMarkers = [];
		var villes  = json;
		// On parcourt l'objet villes
		for(ville in villes){
			var marker = new google.maps.Marker({
 
				// parseFloat nous permet de transformer la latitude et la longitude en nombre décimal
	position: 
       {
        lat: parseFloat(villes[ville].latitude_p),
        lng: parseFloat(villes[ville].longitude_p)
        },
	title: villes[ville].pseudo,
	map: map
	});	
		tabMarkers.push(marker);}
	});
 
			// Nous ajoutons un marqueur
var marker = new google.maps.Marker({
	// Nous définissons sa position (syntaxe json)
	position: {lat: lat, lng: lon},
	// Nous définissons à quelle carte il est ajouté
	map: map
});
 
}

La requ�te ajax se fait bien mais je ne comprend pas pourquoi elle ne s'affiche pas sur google map ni m�me si je fais une console.log dans la boucle. Apr�s je suis d�butant et je ne comprend pas tout de ce que je fais.

J'ai bon essay� dans tous les sens �a ne fonctionne pas, je parviens juste � obtenir un point de rep�re...

Je d�sesp�re r�ellement, � croire que personne ne sait faire �a ou ne me comprend.

C'est pourtant simple, afficher des markers en boucle provenant d'une base de donn�es sql et dont le resultat est converti en format json.


Si vous pouviez m'aider votre aide serait la bienvenue.


Merci et bonne soir�e.

[Toufik83]

Bonjour,

La variable $retour dans la boucle actuelle qui r�cup�re les donn�es mysql devrait �tre un tableau, dans laquelle vous stockez toutes les lignes r�cup�r�es par la requ�te.

Essayez de la d�clarer comme un tableau vide avant la boucle, puis apr�s vous la remplissez comme suite :

Code php :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
$retour=[];//déclaration
while($row = mysqli_fetch_array($req, MYSQLI_ASSOC)){
   $retour[] = $row;// Notez les crochets [] ici !
}
echo json_encode($retour); //renvoyer le retour en tant que json

Puis du c�t� JS, utilisez des console.log pour visualiser les donn�es r�cup�r�es depuis PHP :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
$.ajax(.......)
.done(function(json){
    console.log("json reçu :",json);//vous voyez cette ligne dans la console du navigateur ?
})

[Mrzikel]

Merci Toufik83,

Je viens de parvenir � faire mes rep�res sur la carte google map, c'�tait bien le tableau le probl�me, gr�ce � vous je vais pouvoir avancer sur le reste
Je dois encore pouvoir afficher les pseudo sur les rep�res ainsi qu'une bulle d'informations pour chaque rep�res.

Passez une tr�s bonne soir�e, et encore merci.