# 03 Tabellen

Tabellen eignen sich hervorragend für Übersichten: aktuelle Werte, Minima, Maxima und Trends für viele Variablen auf einen Blick. In diesem Tutorial baust du Schritt für Schritt eine Übersichtstabelle wie diese:

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-f64c7a93474ac5a128e6396c19ff18f368ed006a%2Fgrafana-vis-table-complete-01.png?alt=media" alt=""><figcaption></figcaption></figure>

## Was du lernst

* Zeitreihendaten mit der Reduce-Transformation in eine Tabelle umwandeln
* Sparklines für Trendanzeige in Zellen hinzufügen
* Zellen-Anzeigetypen konfigurieren (farbiger Text, Gauge, farbige Hintergründe)
* Spalten umbenennen, ausblenden und neu anordnen
* Sortierung und Tabellenfuß aktivieren

## Voraussetzungen

* [Tutorial 1.2: Dein erstes Dashboard](https://docs.enlyze.com/integrations/grafana/getting-started/02-first-dashboard) abgeschlossen
* Grundlegendes Verständnis der Panel-Erstellung

***

## Einfache Tabelle erstellen

Zeitreihendaten werden in Grafana standardmäßig als Diagramm angezeigt. Wechselst du die Visualisierung auf **Table**, siehst du die Rohdaten: eine Zeile pro Zeitstempel mit allen Variablen als Spalten.

1. Bearbeite dein Dashboard und klicke auf **Add** → **Visualization**
2. Wähle deine ENLYZE-Datenquelle
3. Wähle einen Standort und eine Maschine
4. Wähle mehrere Variablen aus (z. B. verschiedene Extruder-Durchsätze)

   <figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-fe3514cb8271f6819c38d7f4ed80808f228de33c%2Fgrafana-vis-table-query-multi-01.png?alt=media" alt=""><figcaption></figcaption></figure>
5. Wähle im Visualisierungs-Dropdown (oben rechts im Panel-Editor) **Table** aus

Die Tabelle zeigt jetzt die rohen Zeitreihendaten mit einer Zeile pro Zeitstempel:

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-c2b87413ab6d0e5296d094fee8c738944c37de57%2Fgrafana-vis-table-raw-01.png?alt=media" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Diese Rohansicht ist nicht besonders übersichtlich. Im nächsten Schritt wandelst du die Daten mit einer Transformation in eine Zusammenfassung um.
{% endhint %}

***

## Reduce-Transformation

Die **Reduce**-Transformation wandelt Zeitreihendaten in zusammenfassende Statistiken um. Aus vielen Datenpunkten pro Variable werden einzelne Werte wie Minimum, Maximum, Mittelwert und der aktuelle Wert.

1. Wechsle im Panel-Editor zum Tab **Transform**
2. Klicke auf **+ Add transformation** und wähle **Reduce**
3. Wähle im Feld **Calculations** die gewünschten Statistiken:

   | Berechnung     | Beschreibung                               |
   | -------------- | ------------------------------------------ |
   | **Last \***    | Aktuellster Nicht-Null-Wert                |
   | **Min**        | Minimalwert im Zeitbereich                 |
   | **Max**        | Maximalwert im Zeitbereich                 |
   | **Mean**       | Durchschnittswert                          |
   | **Difference** | Differenz zwischen letztem und erstem Wert |
   | **All values** | Array aller Werte (für Sparklines)         |

   <figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-c8658125740e4c878bf5e091dfc0fe3dcc0cef92%2Fgrafana-vis-reduce-config-01.png?alt=media" alt=""><figcaption></figcaption></figure>

Die Tabelle zeigt jetzt eine Zeile pro Variable mit den berechneten Spalten:

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-b0b8dc102749d30f6cc3263a64005fab60a88141%2Fgrafana-vis-table-reduced-01.png?alt=media" alt=""><figcaption></figcaption></figure>

***

## Sparklines

Sparklines sind Minidiagramme innerhalb von Tabellenzellen, die den Trend auf einen Blick zeigen.

1. Stelle in der Reduce-Transformation sicher, dass **All values** als Berechnung ausgewählt ist
2. Gehe zum Abschnitt **Overrides** in der rechten Seitenleiste
3. Klicke auf **+ Add field override** → **Fields with name** → wähle "All values"
4. Klicke auf **+ Add override property** → **Cell type** → wähle **Sparkline**

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-fd8b312671fe043e5c3632e8a67ff190a677191c%2Fgrafana-vis-table-sparklines-01.png?alt=media" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Für ein einheitliches Erscheinungsbild kannst du eine feste Farbe für alle Sparklines setzen: **Standard options** → **Color scheme** → **Single color**.
{% endhint %}

***

## Zellen-Anzeigetypen

Grafana bietet verschiedene Möglichkeiten, Werte in Tabellenzellen darzustellen. Zellentypen werden über **Overrides** konfiguriert: Override für die gewünschte Spalte hinzufügen, dann die Eigenschaft **Cell type** setzen.

### Farbiger Text mit Wertzuordnungen

Kombiniere den Zellentyp **Colored text** mit **Value mappings**, um Veränderungen visuell hervorzuheben. Zum Beispiel für eine Spalte "Difference":

1. Füge einen Override für die Spalte hinzu
2. Setze **Cell type** auf **Colored text**
3. Füge die Eigenschaft **Value mappings** hinzu und klicke auf **Edit value mappings**

   <figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-5ad468c8a8225d72c3c4714568f780fca7f15b0c%2Fgrafana-vis-table-override-colored-01.png?alt=media" alt=""><figcaption></figcaption></figure>
4. Wähle als Typ **Range** und erstelle Bereichszuordnungen. Da Grafana keine Vergleichsoperatoren wie `> 0` unterstützt, werden stattdessen große Bereiche verwendet:

   | Von    | Bis   | Anzeige  | Farbe |
   | ------ | ----- | -------- | ----- |
   | -10000 | -0,01 | ↓ Down   | Rot   |
   | -0,01  | 0,01  | → Stable | Grün  |
   | 0,01   | 10000 | ↑ Up     | Blau  |

   <figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-0b2deb55cd2f673980754b69d03933b7c0ad80d3%2Fgrafana-vis-value-mapping-modal-01.png?alt=media" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-e9dcec185cedd0c3854b08274bbae1fb997aa4bc%2Fgrafana-vis-table-colored-01.png?alt=media" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Statt **Colored text** kannst du auch **Colored background** verwenden, um die gesamte Zelle einzufärben. In der fertigen Tabelle am Ende dieses Tutorials siehst du diesen Ansatz in Aktion.
{% endhint %}

### Gauge-Zellen

Der Zellentyp **Gauge** zeigt einen Balken, der den Wert relativ zu Minimum und Maximum darstellt.

1. Füge einen Override für die Spalte "Last \*" hinzu
2. Setze **Cell type** auf **Gauge**
3. Konfiguriere **Min** und **Max** unter den Override-Eigenschaften

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-fa31cf07af2677a849b5e646b9b54a3557ead158%2Fgrafana-vis-table-gauge-cells-01.png?alt=media" alt=""><figcaption></figcaption></figure>

***

## Spaltenorganisation

Die Transformation **Organize fields** ermöglicht das Umbenennen, Neuanordnen und Ausblenden von Spalten.

1. Füge im Tab **Transform** die Transformation **Organize fields by name** hinzu
2. Benenne Spalten um, z. B.:

   | Original           | Umbenannt |
   | ------------------ | --------- |
   | Field              | Variable  |
   | Last \*            | Current   |
   | All values         | Trend     |
   | Difference percent | Change    |
3. Blende unnötige Spalten aus (z. B. "First \*"), indem du auf das Augensymbol klickst
4. Ordne die Spalten per Drag-and-Drop in der gewünschten Reihenfolge an

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-35969148d3c5468c4a2a6af9db317331aa2c504f%2Fgrafana-vis-organize-fields-01.png?alt=media" alt=""><figcaption></figcaption></figure>

***

## Die fertige Tabelle

Die einzelnen Schritte ergeben zusammen eine umfassende Übersichtstabelle. Hier ist die vollständige Konfiguration:

### Transformationen

1. **Reduce** mit: Last \*, Min, Max, Mean, All values, Difference percent
2. **Organize fields**: Spalten umbenennen (Variable, Current, Minimum, Maximum, Average, Change, Trend) und "First \*" ausblenden
3. **Sort by**: Alphabetisch nach Variable

### Overrides

| Spalte  | Zellentyp          | Zusätzliches                                          |
| ------- | ------------------ | ----------------------------------------------------- |
| Current | Gauge              | Min: 0, Max: auto                                     |
| Change  | Colored background | Value Mappings mit Pfeilen (↓↓ Down, → Stable, ↑↑ Up) |
| Trend   | Sparkline          | Feste Farbe (z. B. Blau)                              |

### Sortierung

Die Transformation **Sort by** sortiert die Tabelle alphabetisch nach der Spalte "Variable". Nutzende können zusätzlich auf Spaltenüberschriften klicken, um die Sortierung zu ändern.

### Tabellenfuß

Unter **Table** → **Footer** in der rechten Seitenleiste:

1. Aktiviere **Show table footer**
2. Wähle als Berechnung **Sum**
3. Wähle die Spalte "Last \*" (angezeigt als "Current")

Der Tabellenfuß zeigt den Gesamtdurchsatz über alle Variablen an.

### Ergebnis

<figure><img src="https://3556205377-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fn6Jn6Re8NNPSKD1jGZyL%2Fuploads%2Fgit-blob-f64c7a93474ac5a128e6396c19ff18f368ed006a%2Fgrafana-vis-table-complete-01.png?alt=media" alt=""><figcaption></figcaption></figure>

***

## Tipps

* **Tabelle vs. Diagramm**: Tabellen eignen sich für exakte Werte und den Vergleich vieler Variablen. Diagramme sind besser für Trends über die Zeit.
* **Spalten begrenzen**: Zeige maximal 5-8 Spalten an und blende weniger wichtige Daten aus.
* **Sprechende Namen**: Technische Spaltennamen wie "Difference percent" in verständliche Bezeichnungen wie "Change" umbenennen.
* **Performance**: Sparklines erhöhen den Rendering-Aufwand. Bei großen Datensätzen den Zeitbereich eingrenzen.

***

## Nächste Schritte

* [**Erweiterte Gestaltung**](https://docs.enlyze.com/integrations/grafana/visualisation-types/04-advanced-styling) - Einheiten, Field Overrides und mehr
* [**Dashboard-Organisation**](https://docs.enlyze.com/integrations/grafana/intermediate-features/01-dashboard-organization) - Zeilen, Ordner und Verlinkung