以外的所有字段
我正在使用此语法来尝试在我的页面上创建甜甜圈图。控制台没有显示错误，但我没有创建图形。
我已经验证了查询是准确且有效的。我还使用console.log验证了JavaScript数组的结果。
某些东西阻止了图表显示，但控制台是空的。我应该更改该图表，以使图形按照我需要在页面上显示？
<?php
$con=mysqli_connect("site", "user", "pass", "db");
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$sql="Select donorName, numdonors500Club, numdonors5000Club, numdonors50000Club, numdonors500000Club, numdonors500000000Club FROM donors";
$result = mysqli_query($con,$sql);
$data = [];
while($row = $result->fetch_array(MYSQLI_ASSOC)) {
$data[] = $row;
}
mysqli_free_result($result);
mysqli_close($con);
?>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css">
</head>
<body>
<canvas id="doughnut-chart" width="800" height="450"></canvas>
</body>
<script type="text/javascript">
var ctx = document.getElementById('doughnut-chart').getContext('2d');
var information = <?php echo json_encode($data) ?>;
new Chart(document.getElementById("doughnut-chart"), {
type: 'doughnut',
data: {
labels: ["500 Club", "5000 Club", "50000 Club", "500000 Club", "5000000 Club"],
datasets: [
{
label: "Donors",
data: information,
}
]
},
options: {
title: {
display: true,
text: 'Donor Info'
}
}
});
</script>
</html>
您在
中提供的data datasets: [
{
label: "Donors",
data: information,
}
]
即。information是number[]，数字数组。您的SQL查询返回JSON对象。因此，您将仅包括来自单个对象的数值。您可以使用.map()。包括donorName