# Result Visualization – Gate v0 Analysis

## Zweck der Anwendung
Diese Web-Oberfläche dient zur **Visualisierung** der Ergebnisse aus den *Frozen-Runs* und *Robustheitstests* des Gate v0 Systems. Sie unterstützt den **vergleichenden Blick** auf pinned und unpinned Szenarien sowie eine **explorative Analyse** der statistischen Resultate.

## Hauptfunktionen
- Darstellung und Vergleich der Frozen-Run-Ergebnisse
- Filterung nach *Run-Typ* (pinned/unpinned) und Metriken
- Interaktive Diagramme zur Exploration der Kennzahlen
- Anzeige statistischer Größen wie Mischfenster, Korrelationen usw.
- Automatisches Laden der Laufdaten über die API `/results`

## Datenflussüberblick
1. Beim Laden der Webanwendung wird automatisch ein Request an `/results` gesendet.
2. Das Antwortobjekt (JSON) enthält verschiedene Runs mit ihren Parametern, Statistiken und Diagrammdaten.
3. Diese Daten werden im Frontend analysiert und an Visualisierungs-Module übergeben.
4. Das UI bietet Filteroptionen und vergleicht pinned ↔ unpinned Konfigurationen.

## API-Interaktion
Die Anwendung verwendet ausschließlich **GET**-Anfragen zur Route:

```
GET /results
```

**Optionale Parameter:**
- `run_type` — kann `pinned` oder `unpinned` sein
- `metric` — bestimmt die anzuzeigende Kennzahl

**Erwartete Antwortstruktur:**
Ein JSON-Array mit Objekten im Format:
```json
{
  "id": "string",
  "type": "pinned" | "unpinned",
  "parameters": { ... },
  "statistics": { ... },
  "chartData": [ ... ]
}
```

Diese Daten werden anschließend im Analysemodul verarbeitet und über visuelle Komponenten dargestellt.

## Dateistruktur
```
project-root/
  ├── index.html        # Einstiegspunkt der Anwendung
  ├── css/              # Stylesheets
  ├── js/               # JS-Module (api, charts, filters, app)
  ├── README.md         # Diese Datei
  └── ...
```

## Setup und Nutzung
1. Repository klonen oder in lokalem Entwicklungsverzeichnis bereitstellen.
2. Webserver starten (z. B. mit `python3 -m http.server` oder einem ähnlichen statischen Server).
3. `index.html` im Browser öffnen.
4. Die Anwendung lädt automatisch Daten von `/results` und baut die Diagramme auf.

> **Hinweis:** Die API muss im selben Origin oder via CORS erreichbar sein.

## Barrierefreiheit & Responsivität
- Mobile-first Layout mit fließender Typografie
- ARIA-Rollen für interaktive Elemente
- Farbkontraste gemäß WCAG 2.1 AA

## Copyright
© 2026 Donau2Space.de