Как я могу отобразить график, если я выбрал идентификатор в раскрывающемся списке foreach?

Question

Я хочу выбрать вид кофе в раскрывающемся списке и через него он должен отображать или отображать статистику на графике. У меня есть 3 таблицы. Я надеюсь, что вы можете помочь мне решить эту проблему. Проблема в том, что я не могу отобразить соответствующий график выбранного кофе. Это линейный график с тремя различными данными.

это HTML-код

    @foreach($roast as $key => $roast)
    <option value="{{ $roast->coffee_id }}">{{ $roast->coffeeName }}</option>
    @endforeach

/ * Настройки подключения к базе данных * /

$mysqli = new mysqli($host,$user,$pass,$db) or die($mysqli->error);

 $time = '';
$s01 = '';
$s02 = '';
$s03 = '';

//query to get data from the table
$sql = "SELECT * FROM `coffee_temperature` ";
$result = mysqli_query($mysqli, $sql);

//loop through the returned data
while ($row = mysqli_fetch_array($result)) {

    $time = $time . '"'. $row['time'].'",';
    $s01 = $s01 . '"'. $row['s01'].'",';
    $s02 = $s02 . '"'. $row['s02'] .'",';
    $s03 = $s03 . '"'. $row['s03'] .'",';
}

 $time = trim($time.",");
$s01 = trim($s01,",");
$s02 = trim($s02,",");
$s03 = trim($s03,",");



            var ctx = document.getElementById("chart").getContext('2d');
            var myChart = new Chart(ctx, {
            type: 'line',
            data: 
            {
                labels: [<?php echo $time; ?>],
                datasets: 
                [{
                    label: 'Sensor01',
                    data: [<?php echo $s01; ?>]
                },

                {
                    label: 'Sensor02',
                    data: [<?php echo $s02; ?>]
                },
                {
                    label: 'Sensor03',
                    data: [<?php echo $s03; ?>] 
                }]
            },


            options: 
            {
                responsive: true,
                scales:{
                    yAxes: [{beginAtZero: false, setinterval: 3000}],
                    xAxes: [{autoskip: true, maxTicketsLimit: 20}]

            },
                tooltips:{mode: 'index'},
                legend:{display: true, position: 'bottom', labels: {fontColor: 'black', fontSize: 16}}
            }
        });