使用PHP和MYSQL的Google API圖表

Question

您好我正在嘗試使用Google Live圖表API來顯示單個折線圖，該圖表僅顯示Y軸中的數值和X軸中的日期值。

MYSQL：Estado：Numeric Hora：日期

這是我的代碼，我dunno非常多的PHP所以我嘗試了一個例子，我發現但我不能讓它工作。

<?php

 $public =  "admin"; //This is the user i search in the LIKE





class conect

{

private $host;

private $root;

private $pass;

private $db;



public function dbconect($host,$root,$pass,$db)

{

$this->host = $host;

$this->root = $root;

$this->pass = $pass;

$this->db   = $db;

$this->conexion = mysql_connect($this->host,$this->root,$this->pass);

mysql_query("SET NAMES 'utf8'");

mysql_select_db( $this->db, $this->conexion );

}



//se cierra la conexión

public function dbcerrar()

{

mysql_close($this->conexion);

}

//

}



$conex=new conect();



 $conex->dbconect("localhost","root","","database");

//extraccion array de datos

$res = mysql_query("SELECT Estado AS total,Hora FROM Datos WHERE Usuario LIKE '$public'");

while($arr = mysql_fetch_array($res))

{

$arrayhombres[$arr['Hora']] = array(

'Hora' => $arr['Hora'],

'total' => $arr['total'],

);

}





/*

echo "<pre>";

print_r($arrayhombres);

echo "</pre>";

*/

?>

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script type="text/javascript">

google.load("visualization", "1", {packages:["corechart"]});  

    google.setOnLoadCallback(drawChart);



 function drawChart() {

        var data = google.visualization.arrayToDataTable([

          ['Fecha', 'Bateria', 'Mujeres','Sin datos'],



          ['<?php echo date("Y-m-d", $i);?>',<?php echo $totalhombres;?>,<?php echo $totalsindatos;?>],

 <?php 

 }

 ?>

        ]);



        var options = {

          title: 'Estadistica Registros',

 pointShape: 'circle',

 pointSize: 3,//tamaño de los puntos

 series: {//colores de las lineas

            0: { color: '#29ab1e' },

            1: { color: '#2f7ce4' },

          },

 titleTextStyle: {color: '#db6c00',fontSize: 14},//estilos

 tooltip: { textStyle: { color: '#3d3d3d', fontSize: 10 }},//estilo toltip

 legend: {textStyle: {color: '#535353', fontSize: 12 }},//estilos leyenda

 vAxis: { textStyle: {color: '#3d3d3d', fontSize: 12 }},//estilos horizontal

 hAxis: { textStyle: {color: '#3d3d3d', fontSize: 12 }}//estilos vertical

        };



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

        chart.draw(data, options);

      }

</script>

<div id="chart_div" style="width: 400px; height: 300px;"></div>

Answer 1

這是因為您只是將日期加上2組數據放入圖表中，但您要告訴它期望3。

['Fecha', 'Bateria', 'Mujeres','Sin datos']

['<?php echo date("Y-m-d", $i);?>',<?php echo $totalhombres;?>,<?php echo $totalsindatos;?>, EXTRA DATA NEEDED HERE!]

在這之下有一個緊密的支架，我認為不需要在那里。

 <?php 

 }

 ?>

我希望這有幫助

Answer 2

如果這是您的完整代碼，有幾個問題。

首先，查詢數據庫以查找某個用戶的所有行（例如，“admin”）。 然后你取出這些值並將它們放入一個數組$arrayhombres鍵入你不再使用的小時/ horas。 相反，您可以查詢數據庫並直接將行添加到圖表中。

...
$res = mysql_query("SELECT Estado AS total,Hora FROM Datos WHERE Usuario LIKE '$public'");
?>
<script type="text/javascript" src="https://www.google.com/jsapi">    </script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});  
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Fecha/Date', 'Total Hombres'],
      <?php
        while($arr = mysql_fetch_array($res)){
          echo '[Date('.$arr['Hora'].'),'.$arr['total'].'],';
        }
      ?>
    ]
 ...

了解“Fecha / Hora”專欄的格式非常重要。 您可能必須將日期從存儲在SQL數據庫中的日期轉換為javascript DATE對象。

只是為了好玩，這里有一個小提琴，其中包括一個可用於參考的單線圖。 http://jsfiddle.net/ghwh8b0m/