如何将数据从数据库循环到散点图

Question

我想从像foreach之类的数据循环中创建一个图表，但是我不知道如何在javascript中应用它，色点未显示多个数据，图表类型恰好是Chart.js中的Scatter < / p>

    <?php 
    $no = 1;
    $sql = "SELECT * FROM dataset";
    $query = mysqli_query($koneksi, $sql);
    while($u = mysqli_fetch_array($query))
    {
        $c      = $u['c'];
        $c1     = $u['nilai_c1'];
        $c2     = $u['nilai_c2'];   
?>
<div class="chart-container" style="position: relative; height:20vh; width:40vw">
    <canvas id="myChart"></canvas>
</div>
<script>
var ctx = document.getElementById('myChart');

var myChart = new Chart(ctx, {
    type: 'scatter',
    data: {
        datasets: [{
            label: 'Scatter Dataset',
            pointBackgroundColor: ['yellow','blue','red','green'],
            data: [{ <?php $no++; ?>
                x: 1,
                y: 0
            }, {
                x: 0,
                y: 1
            }, {
                x: 1,
                y: -1
            }, {
                x: <?= $c1; ?>, //here
                y: 1
            }]
        }]
    },
    options: {
        scales: {
            xAxes: [{
                type: 'linear',
                position: 'bottom'
            }]
        }
    }
});
</script>
    <?php } ?>