我想生成从数据库表获取输入的图表。在图表中,X轴日期和Y轴消耗时间。对于具有值的后续表行,将发生这种情况。最后生成图表.. 现在我想从表中获取值来生成图表.. 请检查我的代码并帮助我...
谢谢...... database table below...
--------------------------
day time_diff
--------------------------
2016-12-09 00:15:38
2016-12-09 00:10:12
2016-12-09 00:05:40
---------------------------
chart.php
<?php
$mysql =mysqli_connect('localhost', 'root', '', 'chart');
$result = $mysql->query('select * from clock');
$rows = array();
$table = array();
$table['cols'] = array(
array('label' => 'day', 'type' => 'date'),
array('label' => 'time_diff', 'type' => 'time')
);
$rows = array();
while($r=mysqli_fetch_assoc($result))
{
//assumes dates are in the format "yyyy-MM-dd"
$dateString = $r['day'];
$dateArray = explode('-', $dateString);
$year = $dateArray[0];
$month = $dateArray[1] - 1; // subtract 1 to convert to javascript's 0-indexed months
$day = $dateArray[2];
//echo $dateString."<br>";
// assumes time is in the format "hh:mm:ss"
$timeString = $r['time_diff'];
$timeArray = explode(':', $timeString);
$hours = $timeArray[0];
$minutes = $timeArray[1];
$seconds = $timeArray[2];
//echo $timeString;
$temp = array();
$temp[] = array('v' => "date($year-$month-$day)");
$temp[] = array('v' => "time( $hours:$minutes:$seconds)");
$rows[] = array('c' => $temp);
}
$table['rows'] = $rows;
$jsonTable = json_encode($table);
print_r($jsonTable);
//$jsonTable1 = new DateTime( date(strtotime($jsonTable) ));
?>
<html>
<head>
<!--Load the Ajax API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load("visualization", "1", {packages:["corechart"]});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
function drawChart()
{
var bar_chart_data = new google.visualization.arrayToDataTable(<?php echo $jsonTable1; ?>);
var options = {
title:"Company Performance",
width:400,
height:600,
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(bar_chart_data,options);
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
</script>
</head>
</html>
我得到了这个
的输出{"cols":[{"label":"day","type":"date"},{"label":"time_diff","type":"time"}],"rows":[{"c":[{"v":"date(2016,11,09)"},{"v":"time( 00,15,28)"}]},{"c":[{"v":"date(2016,11,10)"},{"v":"time( 03,05,00)"}]},{"c":[{"v":"date(2016,11,11)"},{"v":"time( 06,54,00)"}]},{"c":[{"v":"date(2016,11,14)"},{"v":"time( 00,00,02)"}]}]}