<?php
foreach ($tahun1->getResult() as $row1) : ?>
<?php
foreach ($tahun2->getResult() as $row2) : ?>
<div style="background-color: white; border-radius: 4%;">
    <center>
        <p style="font-weight: bold;">Hasil Peramalan Berdarah <?= $row1->Tahun + 1?> dan Curah Hujan <?= $row2->Tahun + 1?></p>
    </center>
</div>
<?php endforeach?>
<?php endforeach?>





<div style="background-color: white; border-radius: 4%;">
    <canvas id="lineChart" height="300"></canvas>
</div>

<script>
    var chartData = <?= $chart_data ?>;

    var ctx = document.getElementById('lineChart').getContext('2d');
    var myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: chartData.labels,
            datasets: chartData.datasets
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            scales: {
                y: {
                    beginAtZero: true
                }
            }
        }
    });
</script>
