replikation_31b_analysis/data_visualization/README.md

2.3 KiB
Raw Blame History

Data Visualization für Replikationsanalyse Experiment 31b

Übersicht

Diese Webanwendung visualisiert und analysiert die Replikationsdaten des Experiments 31b. Hauptziel ist es, Performance-Trends und Engpässe zu erkennen, indem Bandbreite und retry_tailp99 interaktiv gegenüberstellt werden.

Hauptfunktionen

  • Interaktive Darstellung der Replikationsläufe in dynamischen Diagrammen.
  • Vergleich zwischen Runs, um Änderungen in Bandbreite und retry_tailp99 zu erkennen.
  • Filter nach Segmenttypen: pinned, unpinned, near-expiry.
  • Zeitbasierte Analyse der Metriken und Verlaufstrends.
  • Erkennung von Ausreißern oder Anomalien mittels visueller Hervorhebung.
  • Responsives Dashboard, optimiert für Desktop und Mobile.

Datenfluss

  1. Die Anwendung ruft Replikationsdaten über den API-Endpunkt /run-data ab.
  2. Modul api.js: Verarbeitet den Request (GET /run-data?run_id=<id>) und gibt die JSON-Daten zurück.
  3. Modul visualization.js: Stellt Metriken grafisch dar und synchronisiert die Visualisierung mit Filtereingaben.
  4. UI-Komponenten aktualisieren den DOM in Echtzeit, sobald neue Daten geladen werden.

API-Referenz

Endpunkt: /run-data

  • Methode: GET
  • Parameter: run_id
  • Antwort:
    {
      "run_id": "string",
      "metrics": {
        "bandwidth": [ ... ],
        "retry_tailp99": [ ... ]
      },
      "segments": [ ... ]
    }
    
  • Verwendung: Wird im Modul js/api.js aufgerufen, um Daten an js/visualization.js weiterzugeben.

Ordnerstruktur

project_root/
├── index.html
├── css/
│   └── styles.css
├── js/
│   ├── api.js
│   ├── visualization.js
│   └── ui.js
└── README.md

Verwendung

  1. Setup: Projektdateien auf einen Webserver oder lokalen Entwicklungsserver legen.
  2. Start: index.html im Browser öffnen.
  3. Interaktion:
    • Run-ID im Interface auswählen.
    • Daten werden automatisch über /run-data abgerufen.
    • Diagramme, Tabellen und Filter reagieren dynamisch.

Technische Hinweise

  • Keine externen Ressourcen (Bilder, Icons, Fonts) werden genutzt.
  • Moderne JS-Features (ES6+) werden in allen Modulen eingesetzt.
  • Das Dashboard ist barrierearm und responsiv aufgebaut.

© 2026 Donau2Space.de