使用PHP和MYSQL的Google API图表 - Google API Chart with PHP and MYSQL

你好，我正在尝试使用Google Live charts API来显示一个只在Y轴显示数字值、在X轴显示日期值的单线图。

MYSQL：Estado：数字Hora：日期

这是我的代码，我不太了解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>

如果这是您的完整代码，则会出现几个问题。

您首先在数据库中查询某个用户的所有行（例如"admin"）。然后，将这些值放入一个数组$arrayhombres中，该数组以不再使用的小时/小时为键。相反，您可以查询数据库并直接将行添加到图形中。

...
$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/

这是因为您只将日期加上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 
 }
 ?>

我希望这能帮助