Je veux utiliser JSON??

Question

Je veux utiliser JSON??

Signaler

linda - Modifié par linda le 23/03/2016 à 16:20
jordane45

Messages postés: 28971
Date d'inscription: mercredi 22 octobre 2003
Statut: Modérateur
Dernière intervention: 4 juin 2020

- 24 mars 2016 à 00:49

Bonjour,
Je récupère des éléments de ma base de donnée MySql en php (via fetch ()), et j'aimerai renvoyer ces éléments sous forme de variable va1 et va2 dans mon code javascript.

mon code php:

<?php
 
try
 
{
 
$bdd = new PDO('mysql:host=localhost;dbname=data_marker', 'root', '');
 
}
 
catch (Exception $e)
 
{
 
die('Erreur : ' . $e->getMessage());
 
  
 
}
 
$Latitude = json_encode( $bdd->query('SELECT (lat) FROM markers')->fetchAll(PDO::FETCH_COLUMN, 0), JSON_NUMERIC_CHECK);
 
$Longitude = json_encode( $bdd->query('SELECT (lng) FROM markers')->fetchAll(PDO::FETCH_COLUMN, 0),JSON_NUMERIC_CHECK);
 
$reponse->closeCursor(); // Termine le traitement de la requête
 
  
 
 ?>

mon code java script:

function initialize(){
 
var mapOptions={
 
zoom: 6, // 0 à 21
 
center: new google.maps.LatLng(47,2), // centre de la carte
 
mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP, SATELLITE, HYBRID, TERRAIN
 
}
 
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
 
  
 
var myLatLng= new google.maps.LatLng(va1,va2);
 
var marker = new google.maps.Marker ({
 
position: myLatLng,
 
map: map,
 
titre: "Auriac-sur-vendinelle"
 
});
 
 
 
var myLatLng2 = new google.maps.LatLng(43.6,2.25);
 
var marker2 = new google.maps.Marker ({
 
position: myLatLng2,
 
map: map,
 
titre: "Castres"
 
});
 
 
 
//trajet 1
 
var directionsService = new google.maps.DirectionsService();
 
var directionsDisplay = new google.maps.DirectionsRenderer({
 
'map': map
 
});
 
 
 
var request = {
 
origin: myLatLng,
 
destination: myLatLng2,
 
travelMode: google.maps.DirectionsTravelMode.DRIVING,
 
unitSystem: google.maps.DirectionsUnitSystem.METRIC
 
};
 
 
 
directionsService.route(request, function(response, status){
 
if(status == google.maps.DirectionsStatus.OK){
 
directionsDisplay.setDirections(response);
 
directionsDisplay.suppressMarkers = false;
 
directionsDisplay.setOptions({
 
polylineOptions: {strokeColor: '#008000'},
 
preserveViewport: false
 
});
 
}
 
});
 
 
 
  
 
}

Afficher la suite

A voir également:

1 réponse

Répondre Posez votre question

jordane45 · Answer 1 · 2016-03-23T17:39:54+0100

Réponse 1 / 1

jordane45

Messages postés: 28971
Date d'inscription: mercredi 22 octobre 2003
Statut: Modérateur
Dernière intervention: 4 juin 2020

329
23 mars 2016 à 17:39

Bonjour,

1 - Tu aurais pu continuer dans la conversation initiale au lieu d'ouvrir une nouvelle discussion !
Donc tu as le choix ... soit tu fermes la précédente .... soit tu retourne dans la discussion initiale et je clos celle là !!!

2 - Pourquoi faire deux requêtes .. alors qu'une seule suffit ???

 
$Latitude = json_encode( $bdd->query('SELECT (lat) FROM markers')->fetchAll(PDO::FETCH_COLUMN, 0), JSON_NUMERIC_CHECK);
 
$Longitude = json_encode( $bdd->query('SELECT (lng) FROM markers')->fetchAll(PDO::FETCH_COLUMN, 0),JSON_NUMERIC_CHECK);

A changer par :


try{
  $sql = "SELECT lat,lng FROM markers";
  $sth = $bdd->prepare($sql) ;
  $sth->execute();

  //On stocke le résultat en ARRAY
  $result = $sth->fetchAll();

} catch (Exception $e) {
  die('Erreur : ' . $e->getMessage());
}

//on convertit en JSON
$arr_Json = json_encode($result);

Ensuite.... on ne sait rien de la structure de ton site .... Où se trouve ton code php.. par rapport à ton code javascript ??
As tu enfin accepté d'utiliser de l' AJAX comme je te l'ai proposé ??

Merci d'être plus précise !!!!

Signaler

linda
Modifié par linda le 23/03/2016 à 18:49

bonjour
1-je préfère que je ferme la précédente;mais j'ai essayé de la supprimer mais j'ai pas pu!
2- pour mon travail,j'ai un prog en javascript et l'autre en php et je veux récupérer des éléments de ma base de donnée MySql en php (via fetch ()), et j'aimerais renvoyer ces éléments sous forme de variable va1 et va2 dans mon code javascript.
3-j'ai accepté d'utiliser de l' AJAX comme vous m'avez proposé ^^
Merci
Et comment je récupéré un seule élément du tableaux puis récupérer sa valeur en javascript

Signaler

jordane45

Messages postés: 28971
Date d'inscription: mercredi 22 octobre 2003
Statut: Modérateur
Dernière intervention: 4 juin 2020

329 > linda
23 mars 2016 à 19:36

3-j'ai accepté d'utiliser de l' AJAX comme vous m'avez proposé ^^
Merci
Et comment je récupéré un seule élément du tableaux puis récupérer sa valeur en javascript

Il faut, pour que l'on puisse t'aider, avoir l'intégralité de ton code JAVASCRIPT (celui que tu as mis en place pour l'AJAX).

1-je préfère que je ferme la précédente;mais j'ai essayé de la supprimer mais j'ai pas pu!

Je m'en occupe.

Signaler

linda
Modifié par linda le 23/03/2016 à 20:07

D'accord je vais envoyer tout le travail:
index.php:

<!DOCTYPE html>
<html>
 <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <title>Google Maps API : créer des trajets</title>
  <link rel="stylesheet" href="css/style.css" />
  <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
  <script src="js/script.js"></script>
 </head>
<?php 
try
{
$bdd = new PDO('mysql:host=localhost;dbname=data_marker', 'root', '');
}
catch (Exception $e)
{
die('Erreur : ' . $e->getMessage());
}
try{
  $sql = "SELECT lat,lng FROM markers";
  $sth = $bdd->prepare($sql) ;
  $sth->execute();
//On stocke le résultat en ARRAY
$result = $sth->fetchAll(PDO::FETCH_ASSOC);
} catch (Exception $e) {
  die('Erreur : ' . $e->getMessage());
}
//on convertit en JSON
$arr_Json = json_encode($result,JSON_NUMERIC_CHECK);
echo $arr_Json.'<br />';
 //json_encode(array('prenom' => 'bob'));
echo '<body onload="initialize()">
  <div id="map_canvas"></div>
 </body>';
 
?>
 
</html>

style.css:

html, body{
 height:100%;
 margin: 0;
 padding: 0;
}


#map_canvas{
 height:700px;
 width: 700px;
}

script.js:

function initialize(){
 var mapOptions={
  zoom: 6, // 0 à 21
  center: new google.maps.LatLng(47,2), // centre de la carte
  mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP, SATELLITE, HYBRID, TERRAIN
 }
 var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
 var myLatLng = new google.maps.LatLng(43.52500,1.82694);
 var marker = new google.maps.Marker ({
  position: myLatLng,
  map: map,
  titre: "Auriac-sur-vendinelle"
 });

 var myLatLng2 = new google.maps.LatLng(43.6,2.25);
 var marker2 = new google.maps.Marker ({
  position: myLatLng2,
  map: map,
  titre: "Castres"
 });

 //trajet 1
 var directionsService = new google.maps.DirectionsService();
 var directionsDisplay = new google.maps.DirectionsRenderer({
  'map': map
 });

 var request = {
  origin: myLatLng,
  destination: myLatLng2,
  travelMode: google.maps.DirectionsTravelMode.DRIVING,
  unitSystem: google.maps.DirectionsUnitSystem.METRIC
 };

 directionsService.route(request, function(response, status){
  if(status == google.maps.DirectionsStatus.OK){
   directionsDisplay.setDirections(response);
   directionsDisplay.suppressMarkers = false;
   directionsDisplay.setOptions({
    polylineOptions: {strokeColor: '#008000'},
    preserveViewport: false
   });
  }
 });


 
}

Signaler

linda
Modifié par linda le 23/03/2016 à 20:06

Mon but et de remplacer le premier paramètre de chacune des deux instructions par les éléments de la première colonne de ma table et de remplacer aussi le deuxième paramètre de chacune des deux instructions par les éléments de la deuxième colonne de ma table?

var myLatLng = new google.maps.LatLng(43.52500,1.82694);
 var myLatLng2 = new google.maps.LatLng(43.6,2.25);

Signaler

jordane45

Messages postés: 28971
Date d'inscription: mercredi 22 octobre 2003
Statut: Modérateur
Dernière intervention: 4 juin 2020

329 > linda
24 mars 2016 à 00:49

Tu n'utilises pas du tout l'ajax dans l'exemple de code que tu nous donnes.......

M'enfin.. bref....
fais donc un console.log de la variable $arr_Json dans ton code javascript
comme ceci :

var arrJson = <?php echo $arr_Json ;?>
console.log(arrJson);

Puis regarde dans la CONSOLE de ton navigateur ce que ça t'affiche. (et colle nous le résultat ici....)

Votre réponse