dogstats/web/pages/smart/search.html.php

<h2>Hunde:</h2>
<ul>
    <?php foreach ($dogs as $dog) : ?>
        <li><a href="#<?= $dog ?>"><?= $dog ?></a></li>
    <?php endforeach; ?>
</ul>


<?php foreach ($dogs as $dog) :

    $results = $results_dogs[$dog];
    $sdata = [];
?>

    <h1 id="<?= $dog; ?>"><?= $dog; ?></h1>

    <button onClick="getElementById('table_<?= $dog ?>').style.display='table'">Tabelle anzeigen</button>
    <table id="table_<?= $dog ?>" class="table" style="display:none">
        <tr>
            <th>event</th>
            <th>Wann wars</th>
            <th>run</th>
            <th>rang</th>
            <th>stnr</th>
            <th>teilnehmer</th>
            <th>hund</th>
            <th>verein</th>
            <th>f</th>
            <th>vw</th>
            <th>zf</th>
            <th>zeit</th>
            <th>gf</th>
            <th>msek</th>
            <th>bew</th>
            <th>punkte</th>
        </tr>
        <?php foreach ($results as $res) :
            // graph data preparation

            //if ($res['bew'] != 'DIS' && $res['punkte'] != 'DIS')
            {
                $sdata['dates'][] = date("d.m.Y", strtotime($res['date']));
                $sdata['speed'][] = $res['msek'] ?: 0;
                $sdata['errors'][] = $res['f'] ?: 0;
                $sdata['refusals'][] = $res['vw'] ?: 0;
                $sdata['time'][] = $res['zeit'] ?: 0;
                $sdata['points'][] = $res['punkte'];
                $sdata['ranking'][] = $res['rang'];
            }

        ?>
            <tr>
                <td><?= $res['event'] ?></td>
                <td><?= $res['ago'] ?></td>
                <td><?= $res['run'] ?></td>
                <td><?= $res['rang'] ?></td>
                <td><?= $res['stnr'] ?></td>
                <td><?= $res['teilnehmer'] ?></td>
                <td><?= $res['hund'] ?></td>
                <td><?= $res['verein'] ?></td>
                <td><?= $res['f'] ?></td>
                <td><?= $res['vw'] ?></td>
                <td><?= $res['zf'] ?></td>
                <td><?= $res['zeit'] ?></td>
                <td><?= $res['gf'] ?></td>
                <td><?= $res['msek'] ?></td>
                <td><?= $res['bew'] ?></td>
                <td><?= $res['punkte'] ?></td>

            </tr>
        <?php endforeach; ?>
    </table>

    <?php if (count($results) > 0) : ?>
        <div class="col">
            <div id="graph<?= $dog ?>" data-bs-theme="light" class="card bg-light text-black" style="min-height: 400px;"></div>

            <script type="text/javascript">
                // Initialize the echarts instance based on the prepared dom
                var myChart = echarts.init(document.getElementById('graph<?= $dog ?>'));

                // Specify the configuration items and data for the chart
                var option = {
                    title: {
                        text: 'Stacked Line'
                    },
                    tooltip: {
                        trigger: 'axis'
                    },
                    legend: {
                        data: ['Geschwindigkeit', 'Fehler', 'Verweigerungen', 'Zeit', 'Geschwindigkeit', 'Punkte', 'Platz']
                    },
                    grid: {
                        left: '3%',
                        right: '4%',
                        bottom: '3%',
                        containLabel: true
                    },
                    toolbox: {
                        feature: {
                            saveAsImage: {}
                        }
                    },
                    xAxis: {
                        type: 'category',
                        boundaryGap: false,
                        data: <?= json_encode($sdata['dates']); ?>
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: [{
                            name: 'Geschwindigkeit',
                            type: 'line',
                            stack: 'Total',
                            data: <?= json_encode($sdata['speed']); ?>
                        },
                        {
                            name: 'Fehler',
                            type: 'line',
                            stack: 'Total',
                            data: <?= json_encode($sdata['errors']); ?>
                        },
                        {
                            name: 'Verweigerungen',
                            type: 'line',
                            stack: 'Total',
                            data: <?= json_encode($sdata['refusals']); ?>
                        },
                        {
                            name: 'Zeit',
                            type: 'line',
                            stack: 'Total',
                            data: <?= json_encode($sdata['time']); ?>
                        },
                        {
                            name: 'Punkte',
                            type: 'line',
                            stack: 'Total',
                            data: <?= json_encode($sdata['points']); ?>
                        },
                        {
                            name: 'Platz',
                            type: 'line',
                            stack: 'Total',
                            data: <?= json_encode($sdata['ranking']); ?>
                        }
                    ]
                };

                // Display the chart using the configuration items and data just specified.
                myChart.setOption(option);
            </script>
        </div>
    <?php endif; ?>


<hr>

<?php endforeach; ?>