JS ne reconnait pas une variable php [Résolu]

mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 26 juin 2017 à 13:33 - Dernière réponse : jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention
- 7 juil. 2017 à 18:25
Bonjour a tous.

J ai un probleme avec JS qui ne reconnait pas la variable php.

voici mon script

Merci pour votre aide

<?php
//Démarrage des sessions
session_start ();
 
//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');
 
 
// REQUIRE
 
require_once ('connexion.php');
 
 
//Récupération des variables AVANT de les utiliser
$mes_opcion  = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
print_r(array_values($mes_opcion));
 
 
//Traitement
$sql = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);
 
try{
  $req = $connexion->prepare($sql);
  $req->execute($datas);
  $row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
  echo "Erreur ! ".$e->getMessage();
}
 
$datos_lluvia = array();
if(!empty($row)){
  //On parcours l'array
  foreach($row as $R)  {
    $datos_lluvia[] = (float)$R['lluvia'];
  }
}else{
  echo " La requête n'a pas retournée de données.... ";
}
 
print_r(array_values($datos_lluvia)); // da Array ( [0] => 10 [1] => 40 [2] => 5 [3] => 5 [4] => 20 [5] => 91 )
echo "<pre>datos_lluvia :<br>";
 
print_r($datos_lluvia); // da datos_lluvia :
Array
(
    [0] => 10
    [1] => 40
    [2] => 5
    [3] => 5
    [4] => 20
    [5] => 91
)
 
echo " en Json => " . json_encode($datos_lluvia); //da en Json => [10,40,5,5,20,91]
 
echo "</pre>";
$req->closeCursor();
?>
 
 
 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" > </script>
 
<!-- Load the AJAX API -->
<script type="text/javascript" src="https://www.google.com/jsapi" > </script>
<script type="text/javascript"
src="https://www.google.com/jsapi?autoload={
'modules':[{
'name':'visualization',
'version':'1',
'packages':['corechart']
}]
}"></script>
 
<script type="text/javascript">
 var cargaDatos = <?php echo json_encode($datos_lluvia); ?>;
  console.log(cargaDatos);
  console.log( " cargaDatos : " );
 
 google.setOnLoadCallback(drawChart);
 
function drawChart() {
 
  var datosFinales = google.visualization.arrayToDataTable(cargaDatos);
 
  var options = {
         title: 'Precipitacion',
         curveType: 'function',
         legend: { position: 'bottom' }
       };
 
 var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
 
 chart.draw(datosFinales, options);
 }
  </script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>
Afficher la suite 

31 réponses

Répondre au sujet
Reivax962 3104 Messages postés jeudi 16 juin 2005Date d'inscription 14 décembre 2017 Dernière intervention - 26 juin 2017 à 14:57
0
Utile
14
Bonjour,

Si tu « affiches la source » depuis ton navigateur, ça donne quoi au niveau de ta variable JS ?
Est-ce que la console javascript te donne un message d'erreur ?

Xavier
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 29 juin 2017 à 12:23
le code modifier
<?php
//Démarrage des sessions
session_start ();

//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');


// REQUIRE

require_once ('connexion.php');


//Récupération des variables AVANT de les utiliser
$mes_opcion  = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
print_r(array_values($mes_opcion)); 


//Traitement
$sql = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);

try{
  $req = $connexion->prepare($sql);
  $req->execute($datas);
  $row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
  echo "Erreur ! ".$e->getMessage();
}

$datos_lluvia = array();
if(!empty($row)){
  //On parcours l'array 
  foreach($row as $R)  {
    $datos_lluvia[] = (float)$R['lluvia'];
  }
}else{
  echo " La requête n'a pas retournée de données.... ";
}

print_r(array_values($datos_lluvia));
echo "<pre>datos_lluvia :<br>";

print_r($datos_lluvia);
echo " en Json => " . json_encode($datos_lluvia);
echo "</pre>";

$req->closeCursor();
?>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/loader.js"></script>
   <script type="text/javascript">
     google.charts.load('current', {packages: ['corechart']});     
   </script>

 
 <script type="text/javascript">
//cargamos nuestro array $datos_lluvia creado en PHP para que se puede utilizar en JavaScript 

var cargaDatos = <?php echo json_encode($datos_lluvia); ?>;
console.log(cargaDatos);
console.log( " cargaDatos : " );

google.charts.setOnLoadCallback(drawChart);

function drawChart() {
	
var datosFinales = google.visualization.arrayToDataTable(cargaDatos);
 
var options = {
title: 'Precipitacion',
curveType: 'function',
legend: { position: 'bottom' }
};
 
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
 
chart.draw(datosFinales, options);
}
 
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>


la console
Uncaught (in promise) Error: First row is not an array.
at gvjs_zba (jsapi_compiled_default_module.js:81)
at Object.gvjs_sm [as arrayToDataTable] (jsapi_compiled_default_module.js:83)
at drawChart (new3.php:48)
at <anonymous.
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention > mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 29 juin 2017 à 13:38
Visiblement .... le message d'erreur n'est plus le même ....

Pour ce qui est de ton souci ... je pense que le mieux serait de charger les données en AJAX.
Voici la documentation pour le faire :
https://developers.google.com/chart/interactive/docs/php_example

Bien entendu ... pour l'utiliser avec ton code .. tu dois modifier le getData.php ... en mettant, à la place, le code qui récupère les données dans la bdd

En gros, le fichier getData.php contiendra :

<?php
//Démarrage des sessions
session_start ();

//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');


// REQUIRE

require_once ('connexion.php');


//Récupération des variables AVANT de les utiliser
$mes_opcion  = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
print_r(array_values($mes_opcion)); 


//Traitement
$sql = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);

try{
  $req = $connexion->prepare($sql);
  $req->execute($datas);
  $row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
  $result['ERROR'][] = "Erreur ! ".$e->getMessage();
}

$req->closeCursor();

$datos_lluvia = array();
if(!empty($row)){
  //On parcours l'array 
  foreach($row as $R)  {
   $result[] = (float)$R['lluvia'];
  }
}else{
  $result['ERROR'][] = " La requête n'a pas retournée de données.... ";
}

echo  json_encode($result);




Dans la page HTML de l'exemple ils utilisent :
 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

là encore .. le mieux est de récupérer les fichiers et les mettre en "local" sur ton site.
C'est déjà le cas pour le loader.js .... il faudra que tu fasses de même avec la librairie jquery (que tu peux télécharger ici : https://code.jquery.com/jquery-3.2.1.min.js (c'est la dernière version... ça devrait fonctionner )
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention > jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 29 juin 2017 à 15:11
Tout d abord, merci avec un grand M pour ton aide.

Ja i modifier mon script.

Le voici

<?php
//Démarrage des sessions
session_start ();

//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');


// REQUIRE

require_once ('connexion.php');


//Récupération des variables AVANT de les utiliser
$mes_opcion = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
//print_r(array_values($mes_opcion));


//Traitement
$sql = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);

try{
$req = $connexion->prepare($sql);
$req->execute($datas);
$row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
$result['ERROR'][] = "Erreur ! ".$e->getMessage();
}

$req->closeCursor();

$datos_lluvia = array();
if(!empty($row)){
//On parcours l'array
foreach($row as $R) {
$result[] = (float)$R['lluvia'];
}
}else{
$result['ERROR'][] = " La requête n'a pas retournée de données.... ";
}

//echo json_encode($result);
?>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>

<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});



//cargamos nuestro array $datos_lluvia creado en PHP para que se puede utilizar en JavaScript

var cargaDatos = <?php echo json_encode($result); ?>;
console.log(cargaDatos);
console.log( " cargaDatos : " );

google.charts.setOnLoadCallback(drawChart);
function drawChart() {

var datosFinales = google.visualization.arrayToDataTable(cargaDatos);

var options = {
title: 'Precipitacion',
curveType: 'function',
legend: { position: 'bottom' }
};

var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

chart.draw(datosFinales, options);
}

</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>





Dans la console
(6) [10, 40, 5, 5, 20, 91]
new4.php:21 cargaDatos :
jsapi_compiled_default_module.js:81 Uncaught (in promise) Error: First row is not an array.
at gvjs_zba (jsapi_compiled_default_module.js:81)
at Object.gvjs_sm [as arrayToDataTable] (jsapi_compiled_default_module.js:83)
at drawChart (new4.php:26)
at <anonymous>

et dans le code source

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>

<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});



//cargamos nuestro array $datos_lluvia creado en PHP para que se puede utilizar en JavaScript

var cargaDatos = [10,40,5,5,20,91];
console.log(cargaDatos);
console.log( " cargaDatos : " );

google.charts.setOnLoadCallback(drawChart);
function drawChart() {

var datosFinales = google.visualization.arrayToDataTable(cargaDatos);

var options = {
title: 'Precipitacion',
curveType: 'function',
legend: { position: 'bottom' }
};

var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

chart.draw(datosFinales, options);
}

</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>

Mais le graphique ne s affiche pas
Mais var cargaDatos= [10,40,5,5,20,91];
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention > mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 29 juin 2017 à 15:46
..... faut vraiment que tu apprennes à te relire ... et surtout à faire attention !

Dans le code que tu viens de nous poster :
- Tu as remis un lien vers une url pour un script JS alors qu'on avait dit (corrigé...) qu'il fallait mieux les mettre en local sur ton site !

- Tu n'as pas du lire le lien que je t'ai donné .... car tu n'as toujours pas changé ton code pour le faire en ajax ....
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention > jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 29 juin 2017 à 15:59
excuses moi pour url js, mais je fais des test avec l un ou l autre.

Pour ajax j ai sauté la ligne. J'yvais voir des maintenant.

Merci
Commenter la réponse de Reivax962
Reivax962 3104 Messages postés jeudi 16 juin 2005Date d'inscription 14 décembre 2017 Dernière intervention - Modifié par Reivax962 le 29/06/2017 à 12:36
0
Utile
8
Bonjour,

Tu n'as pas donné le code source généré (celui qu'on obtient dans le navigateur en « affichant la source »).
Or c'est probablement là qu'on verra le problème, puisque ton erreur survient a priori dans le navigateur et non côté serveur.

Par ailleurs, ta page html n'est pas correcte à cause des « echo » et « print_r » de ton code php.
Ces éléments sont importants pour voir ce qu'il se passe, mais il faut les supprimer (ou commenter) quand tu n'en as plus besoin.
Comme ils apparaissent dans la page html avant le tag <html>, ils peuvent très probablement poser des soucis aux navigateurs et scripts.
Mets en commentaires ces lignes-là :
/*
print_r(array_values($datos_lluvia));
echo "<pre>datos_lluvia :<br>";

print_r($datos_lluvia);
echo " en Json => " . json_encode($datos_lluvia);
echo "</pre>";
*/


Xavier
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention > mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 29 juin 2017 à 17:37
J ai creer un ficher new1.php qui recupere les donnes et contient
<?php
//Démarrage des sessions
session_start ();

//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');


// REQUIRE

require_once ('connexion.php');


//Récupération des variables AVANT de les utiliser
$mes_opcion  = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
//print_r(array_values($mes_opcion)); 


//Traitement
$sql = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);

try{
  $req = $connexion->prepare($sql);
  $req->execute($datas);
  $row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
  $result['ERROR'][] = "Erreur ! ".$e->getMessage();
}

$req->closeCursor();

$datos_lluvia = array();
if(!empty($row)){
  //On parcours l'array 
  foreach($row as $R)  {
   $result[] = (float)$R['lluvia'];
  }
}else{
  $result['ERROR'][] = " La requête n'a pas retournée de données.... ";
}

//echo  json_encode($result);
?>


et un ficher new4.php pour traiter le graph qui contient
<?php
//Démarrage des sessions
session_start ();

?>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="js/loader.js"></script>
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
 
 <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      
   
     
  //cargamos nuestro array $datos_lluvia creado en PHP para que se puede utilizar en JavaScript 

var jsonData = $.ajax({
   url: "new1.php",
          dataType: "json",
          async: false
          }).responseText;
    
console.log(jsonData);


google.charts.setOnLoadCallback(drawChart);
function drawChart() {
 
var datosFinales = google.visualization.arrayToDataTable(jsonData);


var options = {
title: 'Precipitacion',
curveType: 'function',
legend: { position: 'bottom' }
};
 
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
 
chart.draw(datosFinales, options);
}
 
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>




erreur console:
1- [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
2- jsapi_compiled_default_module.js:81 Uncaught (in promise) Error: Not an array
at gvjs_zba (jsapi_compiled_default_module.js:81)
at Object.gvjs_sm [as arrayToDataTable] (jsapi_compiled_default_module.js:83)
at drawChart (new4.php:27)
at <anonymous>

et le code source est
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="js/loader.js"></script>
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
 
 <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      
   
     
  //cargamos nuestro array $datos_lluvia creado en PHP para que se puede utilizar en JavaScript 

var jsonData = $.ajax({
   url: "new1.php",
          dataType: "json",
          async: false
          }).responseText;
    
console.log(jsonData);


google.charts.setOnLoadCallback(drawChart);
function drawChart() {
 
var datosFinales = google.visualization.arrayToDataTable(jsonData);


var options = {
title: 'Precipitacion',
curveType: 'function',
legend: { position: 'bottom' }
};
 
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
 
chart.draw(datosFinales, options);
}
 
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>



qu'en penses-tu?


EDIT : ENCORE ET ENCORE ET ENCORE !!!!!!!!!
=> Ajout du LANGAGE dans les balises de code (la coloration syntaxique).

Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.
Jordane45
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention > mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 29 juin 2017 à 17:54
Bon...
Déjà (par ce que j'en ai marre de devoir éditer tous tes messages :
<gras Pour poster du code sur le forum.. merci d'utiliser la coloration syntaxique (les balises de code en y PRÉCISANT LE LANGAGE !!! </gras>).
Explications disponibles ici : http://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

Ensuite...
1- [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

Ca ce n'est qu'un WARNING .. pas une erreur.

Puis :
Pourquoi ... est-ce que ton code (javascript) .. ne correspond pas à celui donné en exemple ?
As tu essayé de juste copier/coller le code qui se trouve dans le lien que je t'ai donné ??
Par exemple...
Dans ton Javascript .. ne mettre que :
 // Load the Visualization API and the piechart package.
    google.charts.load('current', {'packages':['corechart']});
      
    // Set a callback to run when the Google Visualization API is loaded.
    google.charts.setOnLoadCallback(drawChart);
      
    function drawChart() {
      var jsonData = $.ajax({
          url: "new1.php",
          dataType: "json",
          async: false
          }).responseText;
          
      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.PieChart(document.getElementById('curve_chart'));
      chart.draw(data, {width: 400, height: 240});
    }

    </script>


NB: Pour éviter le warning (voir mon point N°1 ) il suffit de remplacer :
async: false

par
async: true



A la limite... on pourrait même un peu modifier le code proposé par celui la : (j'en profite pour y ajouter un peu de debug )

// Load the Visualization API and the piechart package.
google.charts.load('current', {'packages':['corechart']});
  
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawChart);
   
function drawChart(){
  $.ajax({
      url: "new1.php",
      dataType: "json",
      async: true,
      success: function(jsonData){
         console.log(jsonData);
        // Create our data table out of JSON data loaded from server.
        var data = new google.visualization.DataTable(jsonData);
        // Instantiate and draw our chart, passing in some options.
        var chart = new google.visualization.PieChart(document.getElementById('curve_chart'));
        chart.draw(data, {width: 400, height: 240});
      },
      error:function(jqXHR, textStatus){
        alert('error :' jqXHR.status + ' : ' +textStatus);
      }
  });      
}  




Si le message d'erreur jsapi_compiled_default_module.js:81 Uncaught (in promise) Error: Not an array
at gvjs_zba (jsapi_compiled_default_module.js:81)
persiste, tu pourras essayer de changer la ligne
var data = new google.visualization.DataTable(jsonData); 
par
var data = new google.visualization.DataTable($.parseJSON(jsonData));
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention > jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 29 juin 2017 à 20:03
Je ne comprend pas pourquoi tu me repete la coloratuion syntaxique.

J insere le code en php et je vois parfaiteemnt les colorations syntaxique.
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention > mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 29 juin 2017 à 20:17
Non non c'est moi qui corrige à chaque fois.
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention > jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 29 juin 2017 à 20:07
Je vais suspendre mes message pendant une semaine. Je reprendrais contact plus tard.

Bonne semaine Jordane
Commenter la réponse de Reivax962
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 6 juil. 2017 à 12:33
0
Utile
1
Bonjour Jordane

J ai modifié le script en enlevant tout ce qui traite du graph et j'ai conservé la ligne de récupération des données en JS
Voici le code. (inserer avec "code php" ou le console.log ne renvoit rien.

<?php
//Démarrage des sessions
session_start ();

//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');


// REQUIRE

require_once ('connexion.php');


//Récupération des variables AVANT de les utiliser
$mes_opcion  = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
print_r(array_values($mes_opcion)); 


//Traitement
$[/sql/sqlintro.php3 sql] = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);

try{
  $req = $connexion->prepare($sql);
  $req->execute($datas);
  $row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
  echo "Erreur ! ".$e->getMessage();
}

$datos_lluvia = array();
if(!empty($row)){
  //On parcours l'array 
  foreach($row as $R)  {
    $datos_lluvia[] = (float)$R['lluvia'];
  }
}else{
  echo " La requête n'a pas retournée de données.... ";
}

print_r(array_values($datos_lluvia));
echo "<pre>datos_lluvia :<br>";

print_r($datos_lluvia);
echo " en Json => " . json_encode($datos_lluvia);
echo "</pre>";
//les echo renvoient bien les données
$req->closeCursor();

?>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  
<script type="text/javascript">
  
var cargaDatos = <?php echo json_encode($datos_lluvia); ?>;
console.log(cargaDatos);
console.log( " cargaDatos : " );
/* console.log ne renvoi rien*/
</script>
</head>
</html>


jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 7 juil. 2017 à 01:08
le console.log ne renvoit rien

Même pas le mot " cargaDatos " ??
Tu pourrais nous faire une capture écran de ta console lorsque tu affiches cette page ??

Et lorsque tu affiches cette page ...est-ce que la parti php
print_r(array_values($datos_lluvia));
echo "<pre>datos_lluvia :<br>";

print_r($datos_lluvia);
echo " en Json => " . json_encode($datos_lluvia);
echo "</pre>";

affiche quelque chose dans ta page ??

ce fichier est-il bien encodé en utf8 sans bom ? (je parle de l'encodage du fichier ......pas de la déclaration php ou html que tu aurais pu inscrire dans ton code ! )
Voir chapitre 1 ici pour les explications :
http://www.commentcamarche.net/faq/47069-html-php-caracteres-accentues-et-l-utf8
(là aussi je veux bien un screen pour pouvoir m'assurer de mes propres yeux que tu as bien vérifié et compris ce que j'ai dit ..... )
Commenter la réponse de mont_dani
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - Modifié par mont_dani le 7/07/2017 à 15:29
0
Utile
4
Bonjour Jordane

Console.log ne renvoit rien même pas le mot cargaDatos

le php renvoi
Array ( [0] => 03 ) Array ( [0] => 10 [1] => 40 [2] => 5 [3] => 5 [4] => 20 [5] => 91 )
datos_lluvia :
Array
(
[0] => 10
[1] => 40
[2] => 5
[3] => 5
[4] => 20
[5] => 91
)
en Json => [10,40,5,5,20,91]

image impr ecran


Console.log renvoit ceci
Imprime ecran de la console




mon fichier est encode en utf8 sans bom
imprime ecran
.


En mettant le code complet ci dessous

<?php
//Démarrage des sessions
session_start ();

//Affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display-errors','on');


// REQUIRE

require_once ('connexion.php');


//Récupération des variables AVANT de les utiliser
$mes_opcion  = !empty($_POST['mes']) ? $_POST['mes'] : (!empty($_SESSION['mes']) ? $_SESSION['mes'] : NULL);
$_SESSION['mes'] = $mes_opcion ;
print_r(array_values($mes_opcion)); 


//Traitement
$sql = 'SELECT fecha, lluvia FROM meteo WHERE MONTH(fecha) = ? ';
$datas = array($mes_opcion[0]);

try{
  $req = $connexion->prepare($sql);
  $req->execute($datas);
  $row = $req->fetchAll(PDO::FETCH_ASSOC); //on stocke les données dans un ARRAY
}catch(Exception $e){
  echo "Erreur ! ".$e->getMessage();
}

$datos_lluvia = array();
if(!empty($row)){
  //On parcours l'array 
  foreach($row as $R)  {
    $datos_lluvia[] = (float)$R['lluvia'];
  }
}else{
  echo " La requête n'a pas retournée de données.... ";
}

print_r(array_values($datos_lluvia));
echo "<pre>datos_lluvia :<br>";

print_r($datos_lluvia);
echo " en Json => " . json_encode($datos_lluvia);
echo "</pre>";

$req->closeCursor();

?>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/loader.js"></script>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>  
<script language="javascript" type="text/javascript">
 
google.charts.load('current', {'packages':['corechart']});
 
var cargaDatos = <?php echo json_encode($datos_lluvia); ?>;
console.log(cargaDatos);
console.log( " cargaDatos : " );

google.charts.setOnLoadCallback(drawChart);

function drawChart() {
	
var datosFinales = google.visualization.arrayToDataTable('cargaDatos');
 
var options = {
title: 'Precipitacion',
curveType: 'function',
legend: { position: 'bottom' }
};
 
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
 
chart.draw(datosFinales, options);
}
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>


erreur dans la console

(6) [10, 40, 5, 5, 20, 91]
new3.php:39 cargaDatos :
jsapi_compiled_default_module.js:81 Uncaught (in promise) Error: Not an array
at gvjs_zba (jsapi_compiled_default_module.js:81)
at Object.gvjs_sm [as arrayToDataTable] (jsapi_compiled_default_module.js:83)
at drawChart (new3.php:45)
at <anonymous>
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 7 juil. 2017 à 15:31
Heu.... la console.... non seulement elle affiche bien le mot cargaDatos .. mais en plus elle affiche bien le contenu de ta variable .....
je les vois d'ici dans ton imprime écran ..... :-(
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention > jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 7 juil. 2017 à 16:01
regarde :
mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention > jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention - 7 juil. 2017 à 18:15
oui d accord avec toi

mais d ou vient cette erreur avec le code complet

erreur dans la console

(6) [10, 40, 5, 5, 20, 91]
new3.php:39 cargaDatos :
jsapi_compiled_default_module.js:81 Uncaught (in promise) Error: Not an array
at gvjs_zba (jsapi_compiled_default_module.js:81)
at Object.gvjs_sm [as arrayToDataTable] (jsapi_compiled_default_module.js:83)
at drawChart (new3.php:45)
at <anonymous>
jordane45 19276 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 16 décembre 2017 Dernière intervention > mont_dani 47 Messages postés mardi 6 juin 2017Date d'inscription 7 juillet 2017 Dernière intervention - 7 juil. 2017 à 18:25
là c'est une erreur au niveau de la librairie ....
Tu utilises "arrayToDataTable"
Il attend un array.... et visiblement tu lui donnes un objet json... normal qu'il tire la tronche ...

Quoi qu'il en soit... je t'avais donné un code permettant de récupérer les données via AJAX.
http://www.commentcamarche.net/forum/affich-34684758-js-ne-reconnait-pas-une-variable-php#22
L'avais tu essayé ???
Si il ne fonctionnait pas..... qu'est-ce qui apparaissait dans la console ??? (et cette fois... avant de me dire "rien" .. vérifie bien !!! )


Sinon du côté de ton code à toi ...
tu peux essayer de remplacer le code
var datosFinales = google.visualization.arrayToDataTable(jsonData);


par :
var datosFinales = new google.visualization.DataTable(jsonData);

Et si ça ne marche toujours pas.. par
var datosFinales = new google.visualization.DataTable($.parseJSON(jsonData));
Commenter la réponse de mont_dani