70 lines
No EOL
2.4 KiB
HTML
70 lines
No EOL
2.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>Results Visualization</title>
|
||
<link rel="stylesheet" href="css/style.css" />
|
||
</head>
|
||
<body>
|
||
<header class="app-header flex align-center" role="banner">
|
||
<div class="container">
|
||
<h1>Results Visualization</h1>
|
||
<p aria-label="Experiment info">Experiment zur Analyse aggregierter Zeitmessungsdaten</p>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<section class="filter-controls toolbar" aria-label="Filter Optionen">
|
||
<div class="container">
|
||
<form id="filter-form">
|
||
<label for="run-type">Run Type:</label>
|
||
<select id="run-type" name="runType">
|
||
<option value="all">Alle</option>
|
||
<option value="pinned">Pinned</option>
|
||
<option value="unpinned">Unpinned</option>
|
||
</select>
|
||
|
||
<label for="metric">Metrik:</label>
|
||
<select id="metric" name="metric">
|
||
<option value="latency_mean">Latenzmittel</option>
|
||
<option value="variance">Varianz</option>
|
||
<option value="stability_index">Stabilitätsindex</option>
|
||
</select>
|
||
|
||
<label for="time-range">Zeitraum:</label>
|
||
<select id="time-range" name="timeRange">
|
||
<option value="last_hour">Letzte Stunde</option>
|
||
<option value="last_day">Letzter Tag</option>
|
||
<option value="last_week">Letzte Woche</option>
|
||
</select>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="summary-cards grid" aria-label="Zusammenfassung">
|
||
<div class="container">
|
||
<div id="summary-cards-container" class="summary-grid" aria-live="polite">
|
||
<!-- Dynamisch befüllte Cards über JS -->
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="chart-container chart-style" aria-label="Hauptdiagramm">
|
||
<div class="container">
|
||
<canvas id="main-chart" role="img" aria-label="Visualisierung der Messdaten"></canvas>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="app-footer text-muted" role="contentinfo">
|
||
<div class="container">
|
||
<p>© 2026 Donau2Space.de</p>
|
||
<p>Aggregierte Messdaten über /results API – Dashboard-Version 1.0</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="js/api.js" type="module"></script>
|
||
<script src="js/visualization.js" type="module"></script>
|
||
</body>
|
||
</html> |