nachtfotografie_iss_jagd/data_visualization

Datenvisualisierung – Nachtfotografie ISS-Jagd

Überblick

Diese Anwendung ist eine Weboberfläche zur interaktiven Analyse und Visualisierung von Messdaten aus dem Nachtfotografie-Experiment zur Beobachtung der Internationalen Raumstation (ISS) im Nebel.

Ziel ist es, über eine einheitliche Benutzeroberfläche Messdaten dynamisch zu laden, visuell darzustellen und auf Basis von Filteroptionen auszuwerten.

---

Hauptfunktionen

• Interaktive Diagramme zur Anzeige von Temperatur, Luftfeuchtigkeit und Signalintensität
• Datenabruf über die API-Route /data
• Filterfunktionen nach Zeitintervallen und Belichtungsparametern
• Responsive Darstellung für Desktop-, Tablet- und Mobilgeräte
• Hervorhebung der ISS-Phasen auf dem Diagramm
• Live-Update bei eintreffenden Messdaten
• Tooltip-Interaktionen für Detailinformationen

---

Datenfluss

1. Abruf der Messdaten über GET /data
2. Verarbeitung im Modul dataHandler (Parsing, Filterung, Sortierung)
3. Übergabe an chartRenderer zur visuellen Darstellung
4. DOM-Update bei Filteränderung oder neuen Daten

Nutzer → UI-Filter → dataHandler → chartRenderer → DOM

---

API-Details

Route: /data

Methode: GET

Zweck: Abrufen der Messdaten zur Visualisierung.

Optionale Query-Parameter:

• filter – definiert etwa Zeitintervalle oder Belichtungsbereiche

Erwartete Antwort: Ein Array von Messobjekten:

[
  {
    "timestamp": "2026-02-22T22:01:00Z",
    "temperature": 3.4,
    "humidity": 87.2,
    "iso": 800,
    "exposure_time": 15.0,
    "brightness": 0.76
  }
]

---

Aufbau des Projektes

/ (Root)
│
├── index.html              # Einstiegspunkt der Anwendung
├── css/
│   ├── style.css           # Layout & Theme
│   └── responsive.css      # Responsive Anpassungen
├── js/
│   ├── app.js              # App-Initialisierung & Event-Handling
│   ├── api.js              # Datenabruf von /data
│   ├── dataHandler.js      # Verarbeitung & Filterung der Daten
│   └── chartRenderer.js    # Erstellung & Aktualisierung der Diagramme
└── README.md               # Diese Datei

---

Nutzung

1. Server starten, der die API /data bereitstellt.
2. Die index.html im Browser öffnen.
3. Messdaten werden automatisch geladen und dargestellt.
4. Filter- oder Zeitbereich im Interface wählen, um Diagramme anzupassen.

---

Barrierefreiheit & Responsiveness

• Semantische HTML-Struktur (header, main, footer, section)
• ARIA-Attribute für interaktive Elemente
• Mobile-first Designansatz mit CSS-Variablen für Abstände, Farben und Breakpoints

---

Sicherheit und Datenschutz

• Es werden keine personenbezogenen Daten gespeichert oder verarbeitet.
• API-Zugriffe sind read-only (GET) und erfordern keine Authentifizierung.

---

Lizenz & Urheberrecht

© 2026 Donau2Space.de – Alle Rechte vorbehalten.