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

Add heatmap_visualization/index.html

Browse source
This commit is contained in:
Mika 2026-03-18 13:17:46 +00:00
commit e3e1cef33c
1 changed files with 53 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
heatmap_visualization/index.html Normal file
View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Resonanzband Heatmap Analyse</title>
<link rel="stylesheet" href="css/style.css">
<script type="module" src="js/app.js" defer></script>
</head>
<body>
<header class="app-header" role="banner">
<h1>Resonanzband-Heatmap Analyse</h1>
</header>
<section class="app-controls" aria-label="Steuerbereich">
<form id="filter-form">
<label for="cohort-select">Kohorte:</label>
<select id="cohort-select" name="cohort_id" aria-label="Kohorten-Auswahl">
<option value="">Alle</option>
</select>
<label for="time-window">Zeitfenster:</label>
<input type="range" id="time-window" name="time_window" min="0" max="100" step="1" aria-label="Zeitfenster-Steuerung">
<button type="submit">Aktualisieren</button>
</form>
</section>
<main class="heatmap-area" role="main" aria-live="polite">
<canvas id="heatmap-canvas" width="800" height="400" aria-label="Resonanzband-Heatmap"></canvas>
</main>
<aside class="heatmap-legend" aria-label="Farbskala und Legende">
<h2>Legende</h2>
<div class="legend-scale">
<div class="legend-gradient" aria-hidden="true"></div>
<ul class="legend-values">
<li>Min</li>
<li>Max</li>
</ul>
</div>
<div class="legend-metrics">
<p><strong>band_center</strong>: <span id="metric-band-center">-</span></p>
<p><strong>band_width</strong>: <span id="metric-band-width">-</span></p>
<p><strong>cluster_score</strong>: <span id="metric-cluster-score">-</span></p>
</div>
</aside>
<footer class="app-footer" role="contentinfo">
<p>© 2026 Donau2Space.de – Experimentelle Resonanzbandanalyse</p>
</footer>
</body>
</html>