我尝试过的示例代码：
<!DOCTYPE html>
<html>
<head>
<title>Creating Dynamic Data Graph using PHP and Chart.js</title>
<style type="text/css">
BODY {
width: 550PX;
}
#chart-container {
width: 100%;
height: auto;
}
</style>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/Chart.min.js"></script>
</head>
<body>
<div id="chart-container">
<canvas id="graphCanvas"></canvas>
</div>
<script>
$(document).ready(function () {
showGraph();
});
function showGraph()
{
{
$.post("../prodStockStatusFetch5.php",
function (data)
{
console.log(data);
var name = [];
var marks = [];
for (var i in data) {
name.push(data[i].student_name);
marks.push(data[i].marks);
}
var chartdata = {
labels: name,
datasets: [
{
label: 'Student Marks',
backgroundColor: '#49e2ff',
borderColor: '#46d5f1',
hoverBackgroundColor: '#CCCCCC',
hoverBorderColor: '#666666',
data: marks
}
]
};
var graphTarget = $("#graphCanvas");
var barGraph = new Chart(graphTarget, {
type: 'bar',
data: chartdata
});
});
}
}
</script>
</body>
</html>
<?php
include "../connectionPDO.php";
// Fetch all post fields
$email = $_REQUEST['email'];
try{
/*$sql = sprintf("SELECT (select cat_name FROM store_categories b where b.slno=a.slno) AS `category`, a.`prod_name` FROM `store_products` a WHERE `client_email` = '".$email."'"); */
//$sql = sprintf("SELECT SUM(a.stock_qty) AS marks, store_categories.cat_name AS student_name FROM store_products a INNER JOIN store_categories ON a.category = store_categories.slno AND a.`client_email` = '".$email."' GROUP BY store_categories.cat_name");
$sql = "SELECT student_id as playerid, marks as score FROM tbl_marks ORDER BY student_id";
//echo $sql;
$STH = $DBH -> query($sql);
$STH -> execute();
$STH->setFetchMode(PDO::FETCH_ASSOC);
$data = array();
foreach ($STH as $row) {
$data[] = $row;
}
print json_encode($data);
}catch (PDOException $e) {
echo $e->getMessage();
}
?>
我在图表画布上收到“未定义”。谁能帮帮我吗？我已经调试了代码，并了解了一件事，即在javascript部件名称中没有完全设置push（data [i] .student_name）。在name.push ...等中未定义任何数据。我无法找出背后的原因。