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

Add 2_interference_visualization/index.html

Browse source
This commit is contained in:
Mika 2026-03-28 16:47:33 +00:00
commit 18b5312b0e
1 changed files with 76 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
2_interference_visualization/index.html Normal file
View file

@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Interference Map Visualization</title>
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<header class="app-header header-bar" role="banner">
<h1>Interference Map Visualization</h1>
<nav aria-label="Run-Auswahl">
<label for="run-select">Run:</label>
<select id="run-select" name="run-select" aria-controls="chart">
<option value="31b">31b</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
</select>
<label for="metric-select">Metrik:</label>
<select id="metric-select" name="metric-select" aria-controls="chart">
<option value="tail">Tail Latency</option>
<option value="band_width">Bandbreite</option>
</select>
</nav>
</header>
<main class="app-main visualization-container" role="main">
<section aria-label="Diagramm der Interferenzdaten">
<canvas id="chart" class="chart-canvas" aria-live="polite"></canvas>
</section>
</main>
<aside class="filter-panel" role="complementary" aria-label="Filter und Auswahloptionen">
<form id="filter-form">
<fieldset>
<legend>Runs filtern</legend>
<div>
<input type="checkbox" id="run-31b" name="runs" value="31b" checked />
<label for="run-31b">Run 31b</label>
</div>
<div>
<input type="checkbox" id="run-32" name="runs" value="32" checked />
<label for="run-32">Run 32</label>
</div>
<div>
<input type="checkbox" id="run-33" name="runs" value="33" checked />
<label for="run-33">Run 33</label>
</div>
<div>
<input type="checkbox" id="run-34" name="runs" value="34" checked />
<label for="run-34">Run 34</label>
</div>
</fieldset>
<fieldset>
<legend>Metriken auswählen</legend>
<div>
<input type="radio" id="metric-tail" name="metric" value="tail" checked />
<label for="metric-tail">Tail Latency</label>
</div>
<div>
<input type="radio" id="metric-bandwidth" name="metric" value="band_width" />
<label for="metric-bandwidth">Bandbreite</label>
</div>
</fieldset>
</form>
</aside>
<footer class="app-footer" role="contentinfo">
<p>© 2026 Donau2Space.de</p>
<p>Interferenz-Messanalyse zur Optimierung von Pool-Isolation. Datenabruf über API-Endpunkt <code>/visualization</code>.</p>
</footer>
<script type="module" src="js/app.js"></script>
</body>
</html>