ESH/diagnosis_top_10_chart.php

<?php
include('log_entry.php');
$label = array();
$data = array();
$v = array();
$colors = array(
    "#FF7733",
    "#F6FF33",
    "#33FFDF",
    "#334BFF"
);
$backColor = array();
function isBinary(string $string): bool
{
    if (strpos($string, ".") === FALSE) {
        return false;
    }

    return true;
}
$date = date("Y-m-d");

$default_start_date = date('Y-m-d', strtotime($date . ' -30 days'));

$default_end_date =  date('Y-m-d', strtotime($date));
$dept_id = "";
error_log("date ." . $default_start_date . "  " . $default_end_date);

if (!empty($_POST['start_date'])) {
    $default_start_date = date('Y-m-d', strtotime($_POST['start_date']));
}
if (!empty($_POST['end_date'])) {
    $default_end_date = date('Y-m-d', strtotime($_POST['end_date']));
}
error_log("date after filter ." . $default_start_date . "  " . $default_end_date);

$sql = "select * from ailment";
$result = mysqli_query($conn, $sql);
while ($row = mysqli_fetch_assoc($result)) {

    $ailment_id = $row['ailment_id'];

    $sql_query = "select count(appointment_id) as count from employee_appointment where  date(appointment_date) >= '" . $default_start_date . "' and  date(appointment_date) <= '" . $default_end_date . "' and (ailments_new='$ailment_id' or ailments_new like '%,$ailment_id%' or ailments_new like '%$ailment_id,%' or ailments_new like '%,$ailment_id,%')  ";


    $result_query = mysqli_query($conn, $sql_query);

    $row_query = mysqli_fetch_assoc($result_query);

    $data[$ailment_id] = $row_query['count'];
    array_push($backColor, $colors[$i]);


    // error_log("in diagnosis chart" . $data . " " . ($row_query['count']));
    // $v = $data;
}
arsort($data);
$val = array();

$keys = array_keys($data);

error_log("all keys ." . print_r($keys, true));

for ($i = 0; $i < 10; $i++) {
    // $val[$i] = $data[$keys[$i]];
    array_push($val, $data[$keys[$i]]);
    $label[$i] = getFieldFromTable('ailment_name', 'ailment', 'ailment_id', $keys[$i]);
}
error_log("whole data " . print_r($data, true));

error_log("refined data " . print_r($val, true));
?>
<script>
    var xaxis = [<?php echo json_encode($label); ?>];
    var chartData = [<?php echo join(',', $val); ?>];
    // var color = [<?php echo  join(',', $backColor); ?>];
    console.log(chartData);

    for (let i = 0; i < 7; i++) {
        xaxis[0][i] = (xaxis[0][i]);
    }

    // prepareChart('pie', chartData, xaxis[0], "Top 10 Diagnosis Trend");

    // var pieOptions = {
    //     responsive: true,
    //     title: {
    //         display: true,
    //         text: "Top Disease"
    //     },
    //     legend: {
    //         position: "bottom"
    //     },
    //     plugins: {
    //         datalabels: {
    //             formatter: (value, ctx) => {
    //                 let datasets = ctx.chart.data.datasets;
    //                 if (datasets.indexOf(ctx.dataset) === datasets.length - 1) {
    //                     let sum = datasets[0].data.reduce((a, b) => a + b, 0);
    //                     let percentage = Math.round((value / sum) * 100) + '%';
    //                     return percentage;
    //                 } else {
    //                     return '';
    //                 }
    //             },
    //             color: '#fff',
    //         }
    //     }
    // };

    // var ctx = document.getElementById('opdDiagChart').getContext('2d');
    // var myChart = new Chart(ctx, {
    //     type: 'pie',
    //     data: {
    //         labels: xaxis,
    //         datasets: [{
    //             label:xaxis,
    //             data: chartData,
    //             backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de',
    //                 "#FF3383", "#33A4FF", "#43FF33", "#B9FF33"
    //             ],
    //             options: pieOptions
    //         }]
    //     },
    //     options: pieOptions
    // });

    // function prepareChart(chartType, chartData, labels, header) {
        var data = {
            labels: xaxis[0],
            datasets: [{
                label: "Top 10 Diagnosis Trend",
                data: chartData,
                backgroundColor: [
                    'rgba(210,105,30,0.8)',
                    'rgba(244,164,96,0.8)',
                    'rgba(222,184,135,0.8)',
                    'rgba(188,143,143,0.8)',
                    'rgba(176,196,222,0.8)',
                    'rgba(184,134,11,0.8)',
                    'rgba(238,232,170,0.8)',
                    'rgba(189,183,107,0.8)',
                    'rgba(128,128,0,0.8)',
                    'rgba(255,255,0,0.8)'
                ],
                borderColor: [
                    'rgb(255, 99, 132,0.8)',
                    'rgb(75, 192, 192,0.8)',
                    'rgb(255, 205, 86,0.8)',
                    'rgba(255,182,193,0.8)',
                    'rgba(219,112,147,0.8)',
                    'rgba(139,69,19,0.8)',
                    'rgba(210,105,30,0.8)',
                    'rgba(244,164,96,0.8)',
                    'rgba(222,184,135,0.8)',
                    'rgba(188,143,143,0.8)'
                ],
                borderWidth: 1
            }]
        };

        var ctx2 = document.getElementById('opdDiagChart').getContext('2d');
        var myChart2 = new Chart(ctx2, {
            type: 'pie',
            data: data,
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                },
                legend: {
                    display: true,
                    position: 'bottom',
                },
                title: {
                    display: true,
                    text: "Top 10 Diagnosis Trend",
                },
                layout: {
                    padding: 20
                }
            }
        });
    // }
</script>