谷歌图表查询mysql

时间:2019-06-03 12:08:39

标签: php html mysql charts

我一直在尝试使用json在php和javascript之间传输信息,但是不起作用。 查询还可以,我检查一下 名为“ dia”的查询结果为日期,“ importe”为数字(浮点数)

有什么主意吗? 感谢您的帮助

<html>
 <head>
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi" > </script>
  
 </head>  
 <body>
   <div id="line_chart" style="width: 100%; height: 500px"></div>
  
     <?php
                            $consulta = "SELECT fecha as dia,SUM(importe) as importe FROM tfg.reservas WHERE fecha  < '2019-05-31' AND fecha > '2019-05-20' GROUP BY DAY(fecha) asc;";

    $json = array();   
$resultado = mysqli_query($conexion,$consulta);
 if ($resultado->num_rows > 0) {
      while($fila = mysqli_fetch_array($resultado)) {
          $dataRow = array(
              $fila['dia'],
              $fila['importe'],
              
          );
          array_push($json, $dataRow);
      }
  }

  $jsonstring = json_encode($json);
?>
     
     <script type="text/javascript">

   google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawChart);
   function drawChart()
   {
    var data = google.visualization.arrayToDataTable([
        [{type: 'date', label: 'dia'}, {type: 'number', label: 'importe'}]
      ]);

      data.addRows(<?= $jsonstring ?>);

    var options = {
     title:'Sensors Data',
     legend:{position:'bottom'},
     chartArea:{width:'95%', height:'65%'}
    };

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

    chart.draw(data, options);
   }
  </script>
 </body>
</html>

0 个答案:

没有答案