在我的图表中显示统计信息(php mysqli)

Question

我想为我的网站做统计，所以，我用数据库编写了php代码

但是我在我的图表中显示它有问题

首先，我的数据库中有一个表格，他的名字是（统计）

它有 3 行：

Id | St_date    | count 
1  | 2016-06-01 | 1 
2  | 2016-06-02 | 0 
3  | 2016-06-03 | 5 
...
9  | 2016-06-09 | 1

我的图代码是：

<script>
  var lineChartData = {
     labels : ["1","2","3","4","5"],
        datasets : [
            {
            fillColor : "rgba(252, 130, 19, 0.74)",
            strokeColor : "#FC8213",
            pointColor : "#FC8213",
            pointStrokeColor : "#fff",
            data : ["1","0","9","5","95"]
            },
        ]
            };
 new Chart(document.getElementById("line").getContext("2d")).Line(lineChartData);
</script>

我试图制作这段代码：'（

<?php
$date1 = date('m');
$date2 = date('Y');
$sql = "SELECT * FROM statistics WHERE MONTH(st_date) = $date1 and YEAR(st_date) = $date2 ";
$sql_sel = mysqli_query($conn,$sql);
while($rows = mysqli_fetch_assoc($sql_sel)){
    echo'
       <script>
        var lineChartData = {
        labels : ["'.$rows['st_date'].'"],
        datasets : [
                {
                fillColor : "rgba(252, 130, 19, 0.74)",
                strokeColor : "#FC8213",
                pointColor : "#FC8213",
                pointStrokeColor : "#fff",
                data : ['.$rows['count'].']
                },
            ]
        };
new Chart(document.getElementById("line").getContext("2d")).Line(lineChartData);
  </script>';
         }
      ?>

但它只显示 1 行。有什么帮助吗？

Answer 1

问题是您正在为数据库中的每一行创建图表 javascript 代码。你应该遍历数据库结果并构建一个数组，然后回显你的javascript代码：

$data = [];
$labels = [];
while($rows = mysqli_fetch_assoc($sql_sel)){
    $data[] = $rows['count'];
    $labels[] = '"'.$rows['st_date'].'"';
}
echo '
<script>
var lineChartData = {
labels : ['.implode(',',$labels).'],
datasets : [
        {
        fillColor : "rgba(252, 130, 19, 0.74)",
        strokeColor : "#FC8213",
        pointColor : "#FC8213",
        pointStrokeColor : "#fff",
        data : ['.implode(',',$data).']
        },
    ]
};
new Chart(document.getElementById("line").getContext("2d")).Line(lineChartData);
</script>';