Mika/run_timing_experiment
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add visualization_tool/index.html

Browse source
This commit is contained in:
Mika 2026-02-24 13:33:03 +00:00
commit d2c18021a4
1 changed files with 65 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
visualization_tool/index.html Normal file
View file

@ -0,0 +1,65 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Webanwendung zur Analyse und Visualisierung von Laufzeitdaten verschiedener Runs." />
<title>Laufzeitanalyse Dashboard</title>
<link rel="stylesheet" href="css/styles.css" />
<script type="module" src="js/app.js" defer></script>
</head>
<body>
<header class="app-header flex-row" role="banner">
<h1 class="app-header__title">Laufzeit‑Analyse &amp; Visualisierung</h1>
<nav class="app-header__nav" role="navigation" aria-label="Hauptnavigation">
<ul class="app-header__nav-list">
<li><a href="#dashboard" class="app-header__nav-link">Dashboard</a></li>
<li><a href="#filter" class="app-header__nav-link">Filter</a></li>
<li><a href="#summary" class="app-header__nav-link">Zusammenfassung</a></li>
</ul>
</nav>
</header>
<div class="app-container flex-row">
<aside class="app-sidebar filter-panel" id="filter" role="complementary" aria-label="Filterleiste">
<form class="filter-panel__form" aria-label="Datenfilter">
<fieldset class="filter-panel__section">
<legend>Run‑Filter</legend>
<label for="run-id-input">Run‑Nummer:</label>
<input type="number" id="run-id-input" name="run" placeholder="z.B. 42" />
</fieldset>
<fieldset class="filter-panel__section">
<legend>Policy Hash</legend>
<input type="text" id="policy-hash-input" name="policy_hash" placeholder="Hash eingeben" />
</fieldset>
<fieldset class="filter-panel__section">
<legend>Pinned‑Status</legend>
<label><input type="checkbox" id="filter-pinned" name="filter_pinned" value="true" /> nur pinned</label>
</fieldset>
<button type="submit" class="filter-panel__submit">Anwenden</button>
</form>
</aside>
<main class="app-main dashboard" id="dashboard" role="main">
<section class="chart-section delta-matrix-panel" aria-label="Δt‑Matrixdarstellung">
<h2 class="chart-section__title">Δt‑Matrix: pinned/unpinned × Δt≥0/&lt;0</h2>
<div id="delta-matrix-container" class="delta-matrix-panel__content" aria-live="polite"></div>
</section>
<section class="chart-section timeline-chart-panel" aria-label="Δt‑Verteilung über Runs">
<h2 class="chart-section__title">Zeitliche Δt‑Verteilungen</h2>
<div id="timeline-chart-container" class="timeline-chart-panel__content" aria-live="polite"></div>
</section>
<section class="summary-panel" id="summary" aria-label="Analytische Zusammenfassung">
<h2 class="summary-panel__title">Wichtigste Erkenntnisse</h2>
<p id="summary-text">Daten werden geladen …</p>
</section>
</main>
</div>
<footer class="app-footer" role="contentinfo">
<p>© 2026 Donau2Space.de · Laufzeit‑Analyseplattform</p>
</footer>
</body>
</html>