Javascript Morris.js没有显示任何图表

我正在尝试制作一个morris.js折线图，显示注册用户的总数

问题是它不会显示在我的index.php上。 我已经导入了所有的javascript和css文件。 有人能帮我吗

我对javascript场景非常陌生。 所以简单的答案是受欢迎的哈哈

这是我的密码：

      <?php

                $connection = $stmt -> prepare("SELECT * FROM `user`");
                $connection -> execute();

                $chart_data = '';

                while($row = $connection -> fetch(PDO::FETCH_ASSOC)){
                  $chart_data .= "{ year:'".$row['ID']."'
                  }";
                }
                $chart_data = substr($chart_data, 0, -2);



                 ?>

                 <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css">
                 <script stc="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
                 <script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
                 <script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script>

                 <script>
                 Morris.Bar({
                   element : 'chart',
                   data:[<?php echo $chart_data; ?>],
                   xkeys:'year',
                   ykeys:['users'],
                 });
                 </script>


                <div class="container" style="width:900px;">
                    <h2 allign="center">Data grafiek</h2>
                    <br><br>
                    <div id="chart"></div>
                </div>

]，
xkeys:“年”，
ykeys:[“用户”]，
});
数据格拉菲克

您的数据应采用以下格式：

 data: [
    { year: '2008', value: 20 },
    { year: '2009', value: 10 },
    { year: '2010', value: 5 },
    { year: '2011', value: 5 },
    { year: '2012', value: 20 }
  ],

我已经更改了jQuery的库。将JS放在HTML代码的末尾

 <script src="https://code.jquery.com/jquery-3.3.1.min.js"
              integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
              crossorigin="anonymous"></script>
                 <script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
                 <script src="https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script>

                 <script>
        $(document).ready(function(){
                 Morris.Bar({
                   element : 'chart',
                   data:[<?php echo $chart_data; ?>],
                   xkeys:'value',
                   ykeys:['year'],
                  labels: ['year']
                 });
               });
</script>

---

如果可以，请尝试此操作并共享您的控制台

让我检查一下。看起来你的数据不是格式。好的，谢谢

  while($row = mysqli_fetch_assoc($result)){
                     $id=$row['id'];  
             $val=$row['fname'];
             $chart_data .= "{ year:'$id',value:'$val'},";
                }
                $chart_data = substr($chart_data, 0, -1);