PHP MySQL谷歌圖表JSON - 完整示例我已經(jīng)搜索了很多，以找到一個(gè)使用MySQL表數(shù)據(jù)作為數(shù)據(jù)源生成Google Chart的好例子。我搜索了幾天，并意識(shí)到使用PHP和MySQL的組合生成Google Chart（餅圖，條形圖，列，表）的示例很少。我終于設(shè)法讓一個(gè)例子起作用了。我之前收到過(guò)StackOverflow的很多幫助，所以這次我會(huì)回復(fù)一些。我有兩個(gè)例子; 一個(gè)使用Ajax而另一個(gè)不使用。今天，我只展示非Ajax示例。用法： 要求：PHP，Apache和MySQL 安裝： ---使用phpMyAdmin創(chuàng)建數(shù)據(jù)庫(kù)并將其命名為“chart” ---使用phpMyAdmin創(chuàng)建一個(gè)表，并將其命名為“googlechart”并制作 確保表只有兩列，因?yàn)槲沂褂昧藘闪?。然而?nbsp; 如果你愿意，你可以使用超過(guò)2列，但你必須改變 為此編寫一點(diǎn)代碼 ---指定列名如下：“weekly_task”和“percentage” ---將一些數(shù)據(jù)插入表中 ---對(duì)于百分比列，只使用一個(gè)數(shù)字 --------------------------------- 示例數(shù)據(jù)：表（googlechart） --------------------------------- weekly_task百分比 ----------- ---------- 睡30 看電影10 工作40 練習(xí)20 PHP-MySQL-JSON-Google圖表示例： <?php
$con=mysql_connect("localhost","Username","Password") or die("Failed to connect with database!!!!");mysql_select_db("Database Name", $con); // The Chart table contains two fields: weekly_task and percentage// This example will display a pie chart. If you need other charts such as a Bar chart, you will need to modify the code a little to make it work with bar chart and other charts$sth = mysql_query("SELECT * FROM chart");/*
---------------------------
example data: Table (Chart)
--------------------------
weekly_task percentage
Sleep 30
Watching Movie 40
work 44
*///flag is not needed$flag = true;$table = array();$table['cols'] = array(
// Labels for your chart, these represent the column titles
// Note that one column is in "string" format and another one is in "number" format as pie chart only required "numbers" for calculating percentage and string will be used for column title
array('label' => 'Weekly Task', 'type' => 'string'),
array('label' => 'Percentage', 'type' => 'number'));$rows = array();while($r = mysql_fetch_assoc($sth)) {
$temp = array();
// the following line will be used to slice the Pie chart
$temp[] = array('v' => (string) $r['Weekly_task']);
3 回答
慕娘9325324
TA貢獻(xiàn)1783條經(jīng)驗(yàn) 獲得超4個(gè)贊
有些人可能在本地或服務(wù)器上遇到此錯(cuò)誤：
syntax error var data = new google.visualization.DataTable(<?=$jsonTable?>);
這意味著他們的環(huán)境不支持短標(biāo)簽解決方案是使用它：
<?php echo $jsonTable; ?>
一切都應(yīng)該工作正常！
臨摹微笑
TA貢獻(xiàn)1982條經(jīng)驗(yàn) 獲得超2個(gè)贊
你可以更輕松地做到這一點(diǎn)。100％的工作你想要的
<?php
$servername = "localhost";
$username = "root";
$password = ""; //your database password
$dbname = "demo"; //your database name
$con = new mysqli($servername, $username, $password, $dbname);
if ($con->connect_error) {
die("Connection failed: " . $con->connect_error);
}
else
{
//echo ("Connect Successfully");
}
$query = "SELECT Date_time, Tempout FROM alarm_value"; // select column
$aresult = $con->query($query);?><!DOCTYPE html><html><head>
<title>Massive Electronics</title>
<script type="text/javascript" src="loder.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart(){
var data = new google.visualization.DataTable();
var data = google.visualization.arrayToDataTable([
['Date_time','Tempout'],
<?php while($row = mysqli_fetch_assoc($aresult)){
echo "['".$row["Date_time"]."', ".$row["Tempout"]."],";
}
?>
]);
var options = {
title: 'Date_time Vs Room Out Temp',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.AreaChart(document.getElementById('areachart'));
chart.draw(data, options);
}
</script></head><body>
<div id="areachart" style="width: 900px; height: 400px"></div></body></html>loder.js鏈接到這里loder.js
添加回答
舉報(bào)
0/150
提交
取消