Zeitreihenanalyse-Grafiken mit MetricsGraphics.js
Kommentare

Eine visuelle Darstellung einer Zeitreihenanalyse lässt sich auf verschiedene Weisen bewerkstelligen, doch nicht alle sind besonders leichtgewichtig. Dabei ist gerade das für viele Entwickler wünschenswert.

Es gibt bereits verschiedene JavaScript-Libraries zur Erstellung von Diagrammen und Grafiken; mit MetricsGraphics.js gesellt sich eine weitere, besonders leichtgewichtig Grafik-Library dazu. Ali Almossawi stellt die JavaScript-Library im Mozilla-Entwickler-Blog vor.

Features und Optionen von MetricsGraphics.js

MetricsGraphics.js wurde auf Basis von D3 erstellt, einer weiteren JavaScript-Library, mit der sich Grafiken und Diagramme erstellen lassen. Dementsprechend unterstützt auch MetricsGraphics.js viele Diagramm-Optionen wie etwa:

  • Liniencharts
  • Streudiagramme
  • Histogramme
  • Barplots
  • Datentabellen
  • Teppichdiagramme
  • Lineare Regressionen

Im Vordergrund stehen dabei vor allem Effizienz und der praktische Nutzen der verschiedenen Diagrammformen, die gleichzeitig ästhetisch ansprechend sein sollen.

Um eine Grafik mit MetricsGraphics.js zu erstellen, müssen nur einige Default-Parameter spezifiziert werden; zudem können – wenn nötig – ein oder mehrere optionale Parameter überschrieben werden. Dabei wird kein Zustand verwaltet, sondern es muss data_graphic auf das gleiche Ziel-Element angewandt werden, um die Grafik zu updaten. Genauso ist die Library daten-quellen-agnostisch; es ist also egal, woher die Daten stammen.

Um zum Beispiel ein Linienchart anzufertigen, wird zunächst eine JSON-Datei erstellt und die Daten geladen. Anschließend wird die Grafik erstellt und in das in target spezifizierte Element platziert. Zusätzlich können noch verschiedene Marker eingefügt werden, um besonders interessante Daten im fertigen Diagramm hervorzuheben.

In Ali Almossawis Artikel zur JavaScript-Library erklärt er die Nutzung von MetricsGraphics.js anhand einer Beispielgrafik; auf der Projekt-Website steht zudem eine Sandbox zum Ausprobieren der Library zur Verfügung, alternativ kann sie über GitHub heruntergeladen werden.

Aufmacherbild: Side view of a businessman’s hand. Business graph on a blackboard. von Shutterstock / Urheberrecht: Nonwarit

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -