> For the complete documentation index, see [llms.txt](https://docs.kiloiot.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.kiloiot.io/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets.md).

# Widgets hinzufügen

Fügen Sie Kilo-Dashboard-Widgets für Live-Daten, Diagramme, Steuerelemente, Karten, Bilder, Text und eingebettete Seiten hinzu und konfigurieren Sie sie.

Widgets sind die visuellen Komponenten eines Dashboards. Daten-Widgets verbinden sich mit Geräten und wandeln Messwerte in aktuelle Werte, Verlauf, Karten oder Status um. Steuerungs-Widgets senden konfigurierte Befehle. Text- und iFrame-Widgets ergänzen Kontext ohne Geräteverbindung. Ein Temperaturmesswert von 22 °C ist in einem Büro normal, aber in der Kühllagerung ein Verstoß gegen Vorgaben — Bereiche, Schwellenwerte und Bedingungen ermöglichen es den Bedienern, diesen Kontext auf einen Blick zu erkennen, statt die Rohzahl selbst zu interpretieren.

## Bearbeitungsmodus wird geöffnet

Widgets können nur hinzugefügt oder geändert werden, wenn sich das Dashboard im **Bearbeitungsmodus**.

1. Öffnen Sie ein Dashboard über die Seitenleiste.
2. Klicken Sie auf das **Aktionsmenü** (drei Punkte) in der Kopfzeile und wählen Sie **Dashboard bearbeiten**.

Im Bearbeitungsmodus ändert sich die Kopfzeile:

* Die **Live-Daten** Indikator wird durch ein kleines **Stiftsymbol** zum Bearbeiten der Dashboard-Metadaten.
* Eine **Plus-Schaltfläche** erscheint — damit öffnet sich die Widget-Auswahl.
* **Abbrechen** und **Speichern** Schaltflächen erscheinen rechts.

Alle Änderungen, die Sie im Bearbeitungsmodus vornehmen, werden nur gespeichert, wenn Sie auf **Speichern**. Klicken **Abbrechen** verwirft alle Änderungen und kehrt in den Ansichtsmodus zurück.

<figure><img src="https://895787959-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtNQh1wBSHSaknslMdOXm%2Fuploads%2Fgit-blob-d579235c88fd85ea08bf2ea34eaf2a06f311a3ef%2Fdashboard-edit-mode.jpg?alt=media" alt="A dashboard in edit mode, showing the placement grid with a widget positioned and the Add widget, Cancel and Save controls"><figcaption></figcaption></figure>

## Die Widget-Auswahl

Klicken Sie auf das **Plus-Schaltfläche** in der Kopfzeile des Bearbeitungsmodus (oder die **Widget hinzufügen** Schaltfläche im Leerzustand), um die Widget-Auswahl zu öffnen.

Die Auswahl zeigt die verfügbaren Widget-Typen.

| Widget                        | Verwenden Sie es, wenn                                                                                                                       | Was es anzeigt                                                                                                                          |
| ----------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
| **Letzte Daten**              | Bediener den aktuellen Zustand einer Maschine, eines Prozesses oder eines Assets benötigen                                                   | Zuletzt empfangener Wert — läuft/gestoppt, Füllstand, aktuelle Temperatur                                                               |
| **Diagramm**                  | Sie verstehen müssen, wie sich ein Messwert verändert hat — Verlauf zur Einhaltung von Vorgaben, Drift oder Vergleich von Schicht zu Schicht | Historisches Diagramm plus der aktuelle Live-Messwert                                                                                   |
| **Text**                      | Ein Dashboard benötigt Überschriften, Betriebsnotizen oder Anweisungen                                                                       | Formatierter Text, der nicht mit einem Gerät verbunden ist                                                                              |
| **Bild**                      | Der Standortkontext ist wichtig — welche Zone, Etage oder Komponente                                                                         | Ihr eigenes hochgeladenes Bild — Grundriss, Maschinendiagramm oder Standortplan — mit an Standorten angehefteten Live-Numerikmesswerten |
| **Karte**                     | Der Live-Standort von etwas, das sich bewegt, ist wichtig                                                                                    | Aktuelle GPS-Position auf einer interaktiven Außenkarte, plus ein ausgewählter Sensorwert am Marker                                     |
| **Steuerung**                 | Ein Bediener muss ein konfiguriertes Kommando an Geräte senden                                                                               | Ein Schalter, eine Schaltfläche, ein Eingabefeld oder ein Schieberegler, verbunden mit einem steuerbaren Gerät                          |
| **iFrame**                    | Externer Kontext gehört auf denselben Bildschirm — ein BI-Bericht, eine Wetterkarte, Live-Verkehr                                            | Eine externe Live-Webseite von einem unterstützten Dienst, eingebettet in die Kachel neben Ihren Gerätedaten                            |
| **Digitaler Gebäudezwilling** | Sie möchten ein 3D-Modell eines Gebäudes mit Sensoren, die den Objekten zugeordnet sind, die sie überwachen                                  | Ein integrierter 3D-Editor, der eine Anlage in eine Live-Szene verwandelt, neu eingefärbt durch Sensorwerte                             |

<figure><img src="https://895787959-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FtNQh1wBSHSaknslMdOXm%2Fuploads%2Fgit-blob-a458c5d7c4f55d3ffc57b7b54ce6ecb05199616c%2Fdashboard-widget-picker.jpg?alt=media" alt="The Choose a widget dialog listing Last data, Chart, Text, Image, Map, Digital building twin, Control and iFrame"><figcaption></figcaption></figure>

## Auswahl eines Widget-Typs

**Letzte Daten** ist Ihre Standardoption für die Anzeige des aktuellen Betriebszustands. Verwenden Sie es, wenn Sie den neuesten Wert von einem oder mehreren Geräten in einem einzigen Panel anzeigen müssen — eine einfache Zahl für einen schnellen Messwert, eine Donut- oder Kreisdiagramm-Anzeige, wenn der Wert eine aussagekräftige Skala hat (Tankfüllstand, Batteriestand, Prozentsatz innerhalb eines Bereichs). Mehrere Geräte können in einem Widget zusammengefasst werden.

**Diagramm** ist für die Sichtbarkeit von Trends. Es zeigt oben einen großen aktuellen Messwert und darunter das historische Diagramm — Sie sehen, wo der Messwert jetzt steht und wie er dorthin gelangt ist. Wählen Sie ein [Liniendiagramm](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/chart-widget/line-chart.md) für einen kontinuierlichen Trend oder ein [Balkendiagramm](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/chart-widget/bar-chart.md) zum Vergleichen einzelner Meldungen. Eine Datenquelle und eine Metrik pro Diagramm-Widget.

**Text** fügt Überschriften, Anweisungen und Betriebsnotizen hinzu. Es ist ein eigenständiges Inhalts-Widget und gehört nicht zur Widget-Familie für Steuerungen.

**Bild** bringt Daten in physischen Kontext. Laden Sie einen Grundriss, ein Standortdiagramm oder ein Anlagenschema hoch und heften Sie dann Live-Sensorwerte an ihre genauen Orte. Verwenden Sie es, wenn der Standort wichtig ist — Überwachung von Lagerzonen, HVAC-Status von Gebäuden nach Etage, Rack-Temperaturen im Serverraum.

**Karte** zeigt, wo sich ein GPS-ausgestattetes Gerät gerade auf einer interaktiven Außenkarte befindet, mit einer zusätzlichen Metrik am Marker. Fahrzeuge, Außengeräte, mobile Werkzeuge, Sendungen, Vieh — alles, was sich bewegt und seinen Standort meldet, kann darauf dargestellt werden. Datumsbereichssteuerungen ermöglichen es Ihnen, die Routenhistorie zu überprüfen, ohne das Dashboard zu verlassen.

**Steuerung** sendet einen konfigurierten Gerätebefehl über einen Schalter, eine Schaltfläche, ein Eingabefeld oder einen Schieberegler. Es ist das einzige Widget auf Auswahl-Ebene, dessen Zweck die Steuerung von Geräten ist; Diagramm, Text, Bild und Karte sind separate Widget-Typen.

**Digitaler Gebäudezwilling** ist ein 3D-Modell einer Anlage, das direkt im Dashboard erstellt und bearbeitet wird. Zeichnen Sie das Gebäude, platzieren Sie Objekte aus einem Katalog und binden Sie jedes an einen Sensor — das Modell färbt sich dann in Echtzeit neu ein, sodass ein Bediener den Anlagenzustand räumlich statt aus einer Liste abliest. Siehe [Digitaler Gebäudezwilling](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/digital-building-twin.md).

## Widget hinzufügen

Für jeden Widget-Typ folgt der Einrichtungsablauf demselben Muster:

1. Klicken Sie auf das **Plus-Schaltfläche** oder **Widget hinzufügen** Schaltfläche, um die Auswahl zu öffnen.
2. Wählen Sie einen Widget-Typ aus.
3. Das Konfigurationsfeld des ausgewählten Widgets wird geöffnet.
4. Wählen Sie bei einem datenbasierten Widget unter **Datenquelle**sein Gerät und seine Metrik aus und konfigurieren Sie dann die Darstellung unter **Darstellung**. Eigenständige Widgets wie Text und iFrame öffnen stattdessen ihre eigenen Inhaltseinstellungen.
5. Klicken Sie **Speichern** im Panel, um das Widget hinzuzufügen.

Eine **Schließen-Schaltfläche** (X-Symbol) oben rechts schließt das Panel ohne zu speichern. Die **Weiter** Schaltfläche wechselt von Datenquelle zu Darstellung. Die Einstellungen werden erst angewendet, wenn Sie auf **Speichern** im Panel und dann auf **Speichern** in der Dashboard-Kopfzeile klicken.

Vollständige Konfigurationsdetails finden Sie auf den unten verlinkten widget-spezifischen Seiten.

## Bearbeiten eines vorhandenen Widgets

So ändern Sie ein Widget, das bereits auf dem Dashboard vorhanden ist:

1. Wechseln Sie in den Bearbeitungsmodus.
2. Bewegen Sie den Mauszeiger über das Widget. Ein **Drei-Punkte-Menü** erscheint in der oberen rechten Ecke.
3. Klicken Sie auf das Menü:
   * **Bearbeiten** — Öffnet das Einstellungsfeld des Widgets mit vorausgefüllten aktuellen Werten.
   * **Duplizieren** — Erstellt eine Kopie des Widgets mit all seiner Konfiguration auf demselben Dashboard. Eine Toast-Meldung bestätigt **„Widget erfolgreich dupliziert“**; wenn die Kopie nicht erstellt werden kann, sehen Sie **„Widget konnte nicht dupliziert werden“**.
   * **Zum Dashboard verschieben** — Verschiebt das Widget auf ein anderes Dashboard. Wenn der Verschiebevorgang nicht abgeschlossen werden kann, sehen Sie **„Widget konnte nicht verschoben werden“**.
   * **Löschen** — Markiert das Widget zum Entfernen. Das Löschen wird erst angewendet, wenn Sie auf **Speichern** in der Dashboard-Kopfzeile klicken. Ein Klick auf **Abbrechen** stellt das Widget wieder her.

Das Drei-Punkte-Menü erscheint nur im Bearbeitungsmodus.

**Duplizieren** spart bei wiederholten Bereitstellungen Zeit. Konfigurieren Sie ein Widget exakt so, wie Sie es möchten — Wertebereiche, Schwellenwerte, Anzeigetyp, Bedingungen — und duplizieren Sie es dann einmal pro identischem Sensor und ändern Sie nur das Gerät auf der Registerkarte Datenquelle. Fünfzig Kühllagereinheiten mit demselben Konformitätsbereich sind fünfzig Kopien eines Widgets, nicht fünfzig von Grund auf neu erstellte Konfigurationen.

**Zum Dashboard verschieben** ist für den Fall gedacht, dass eine Ansicht ihren ursprünglichen Platz überholt — eine Metrik, die Sie zu einem allgemeinen Standort-Dashboard hinzugefügt haben, gehört eigentlich auf das Compliance-Dashboard, oder ein Widget wurde ganz auf dem falschen Dashboard erstellt. Verschieben Sie es, statt es neu zu erstellen.

## Der leere Dashboard-Zustand

Wenn ein Dashboard keine Widgets hat, zeigt die Bildschirmmitte:

* **„Hier sind keine Widgets vorhanden“**
* **„Fügen Sie Ihr erstes Widget hinzu, um Ihr Dashboard aufzubauen“**
* Eine **Widget hinzufügen** Schaltfläche

## Anpassung auf einen Blick

Widgets sind konfigurierbar, keine festen Karten. Wichtige Optionen, die widgetübergreifend verfügbar sind:

* **Anzeigetypen für Letzte Daten** — Wert, Donut, Kreisdiagramm, Röhre, Messanzeige und Radialanzeige
* **Diagrammtypen** — Linie und Balken, mit diagrammspezifischen Zeiträumen, Achsen, Schwellenwerten und Legenden
* **Steuerungstypen** — Schalter, Schaltfläche, Eingabe und Schieberegler; der Schieberegler bietet dann die Stile Einfach, Kreisförmig und Vertikal
* **Wertebereiche** — Mindest-/Höchstgrenzen, die den Skalenbereich der Anzeige oder die Y-Achsen-Grenzen des Diagramms festlegen
* **Schwellenwerte** — Benannte Bereiche (z. B. „Konform“, „Warnung“, „Verstoß“) mit Farben, Füllungen und Linien — Diagramm-Widget
* **Bedingungen** — Farblogiken pro Metrik basierend auf dem aktuellen Wert des Sensors — Widgets für Letzte Daten und Bild
* **Steuerungen auf Metrik-Ebene** — Datentyp, Gerätemetrikauswahl, Symbol und Bedingungen pro Sensor

## Anleitungen zur Widget-Konfiguration

* [Widget für Letzte Daten](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/last-data-widget.md) — Neueste Werte, Anzeigetypen, Wertebereiche und Bedingungen
* [Diagramm-Widget](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/chart-widget.md) — Zeitreihendiagramme mit aktuellem Live-Messwert und Schwellenwertbereichen
* [Text-Widget](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/text-widget.md) — Überschriften, Anweisungen und Notizen ohne Gerätequelle
* [Bild-Widget](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/image-widget.md) — Jedes Bild — ein Grundriss, ein Anlagenschema, ein Standortfoto — mit verschiebbaren Live-Daten-Markern
* [Karten-Widget](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/map-widget.md) — Standort eines GPS-Trackers mit Steuerelementen für die Routenhistorie
* [Steuerungs-Widget](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/control-widget.md) — Schalter, Schaltflächen, Eingaben und Schieberegler, die Gerätebefehle senden
* [iFrame-Widget](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/iframe-widget.md) — Betten Sie neben Ihren Gerätedaten eine externe Webseite von einem unterstützten Dienst ein
* [Bedingungen](/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets/conditions.md) — Farblogiken pro Metrik für Widgets für Letzte Daten und Bild

## Verwandte Seiten

* [Dashboards erstellen](/kilo-docs-de/kilo-iot-server/dashboards/creating-dashboards.md) — Erstellen Sie das Dashboard, bevor Sie Widgets hinzufügen.
* [Dashboards organisieren](/kilo-docs-de/kilo-iot-server/dashboards/organizing-dashboards.md) — Verwalten Sie Ordner und die Reihenfolge der Dashboards.
* [Echtzeitdaten](/kilo-docs-de/kilo-iot-server/dashboards/real-time-data.md) — Wie Live-Sensordaten Ihre Widgets erreichen.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.kiloiot.io/kilo-docs-de/kilo-iot-server/dashboards/adding-widgets.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
