Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[painkillerde]

Hi zusammen,

habe die Woche angefangen eine Lovelace Oberfläche zu erstellen da meine VIS1 langsam in die Jahre gekommen ist.

Dabei hab ich etwas mit dem Aufwand gekämpft die Entitäten zu erstellen usw.
Habe nun einen guten Weg gefunden das ganze mit ChatGPT massiv zu vereinfachen - vielleicht hilft das dem ein oder anderen hier. Die Anleitungwurde auch mit ChatGPT erstellt ;)

Hier ist die erweiterte, vollständige Anleitung mit klarer Begründung am Anfang und konkreten Prompt-Beispielen, so dass der Ablauf reproduzierbar ist und sich immer gleich nutzen lässt.

WICHTIG!!! KI macht Fehler!! Ihr dürft euch nicht darauf verlassen - ich lasse jedes Script als DryRun erstellen und laufen bevor ich es wirklich ausführen lasse..

---

Warum dieser Weg?

Ein Lovelace-Dashboard direkt „per Klick“ aufzubauen ist bei komplexen ioBroker-Setups sehr aufwändig:

• Hunderte Datenpunkte müssen einzeln gesucht
• Entitäten müssen manuell benannt, gruppiert und formatiert werden
• Logik (z. B. Richtungen, Status, Zusammenfassungen) landet schnell unübersichtlich in YAML
• Änderungen an Datenpunkten bedeuten oft kompletten Neuaufbau des Dashboards

Dieser Ansatz trennt die Aufgaben sauber:

• ioBroker übernimmt Daten, Logik und Berechnung
• Lovelace ist reine Darstellung
• KI übernimmt Struktur, Syntax und Iteration

So lassen sich auch große Dashboards schnell, reproduzierbar und wartbar erstellen.

---

Gesamtworkflow

1. ioBroker-Objekte als JSON exportieren
2. Relevante Datenpunkte auswählen
3. JavaScript zur Entitäten-Aufbereitung erzeugen
4. Anzeige-Entitäten sammeln
5. Lovelace-YAML generieren
6. Iterativ verfeinern

---

Schritt 1 – Objekte aus ioBroker exportieren

1. ioBroker Admin öffnen
2. Objekte auswählen
3. Relevanten Objektbaum markieren
4. Export als JSON (Zustandsdaten müssen nicht mitgegeben werden wenn nicht gewünscht)

Der Export sollte enthalten:

• vollständige Objekt-IDs
• common.name
• common.role
• common.type
• common.unit

Dieser JSON-Export wird unverändert als Grundlage für die weiteren Schritte verwendet.

---

Schritt 2 – Relevante Datenpunkte festlegen

1. JSON-Export durchsehen
2. Alle Datenpunkte markieren, die im Dashboard erscheinen sollen
3. Bei mehrfach vorhandenen oder ähnlichen Werten eindeutig festlegen, welcher genutzt wird

Zusätzlich definieren:

• Vorzeichen-Bedeutung
• Zustandslogik (aktiv/inaktiv)
• Werte, die nur zeitweise existieren

Diese Entscheidungen werden nicht in Lovelace umgesetzt.

---

Schritt 3 – JavaScript zur Entitäten-Aufbereitung

Im ioBroker-JavaScript-Adapter wird ein Skript erstellt, das aus Rohdaten stabile Anzeige-States erzeugt.

Ziele:

• keine Rohdaten in Lovelace verwenden
• jede Anzeige hat genau einen klaren State
• Logik bleibt zentral an einer Stelle

Typische Aufgaben:

• Trennen von Richtungen
• Ableiten von Statuswerten
• Zusammenfassen mehrerer Rohwerte
• Default-Werte bei fehlenden Daten
• Vereinheitlichen von Einheiten

Nach diesem Schritt existieren ausschließlich Anzeige-Entitäten.

---

Schritt 4 – Entitätenliste erstellen

Alle erzeugten Anzeige-States werden gesammelt:

• vollständige ID
• Einheit
• Bedeutung

Diese Liste ist die einzige Grundlage für das Dashboard-YAML.

---

Schritt 5 – Lovelace-YAML erzeugen

Auf Basis der Entitätenliste wird das YAML generiert:

• vollständige YAML-Blöcke
• keine Fragmente
• zunächst nur Standard-Cards
• klare deutsche Bezeichnungen

Das YAML wird direkt in den Lovelace-Editor eingefügt.

---

Schritt 6 – Fehler prüfen und iterieren

Tritt ein Fehler auf:

1. Fehlermeldung inkl. Zeile/Spalte kopieren
2. YAML-Ausschnitt beilegen
3. korrigierte vollständige Version erzeugen lassen

Typische Fehler:

• falsche Einrückung
• doppelte Schlüssel
• falsche Entity-IDs

Dieser Schritt wird wiederholt, bis das Dashboard fehlerfrei lädt.

---

Schritt 7 – Verfeinerung

• Karten zusammenfassen
• Beschriftungen vereinheitlichen
• Icons ergänzen
• Darstellung kompakter machen

Logikänderungen erfolgen ausschließlich im JavaScript.

---

Bewährte Prompt-Vorlagen

1) Analyse des ioBroker-Objektexports

Hier ist ein ioBroker-Objektexport als JSON.
Analysiere die Struktur und liste alle relevanten Datenpunkte auf,
die für ein Dashboard geeignet sind.
Erhalte IDs, Einheiten und Bedeutung.

---

2) JavaScript zur Entitäten-Erstellung

Nutze diesen ioBroker-Objektexport.
Erstelle ein JavaScript für den ioBroker-JavaScript-Adapter,
das aus den Rohdaten saubere Anzeige-Entitäten erzeugt.

Vorgaben:
- sprechende Namen
- stabile Default-Werte
- klare Trennung von Logik und Darstellung
- keine Lovelace-Abhängigkeiten

---

3) Entitätenliste zusammenfassen

Erstelle aus dem JavaScript eine Liste aller Anzeige-Entitäten
inklusive ID, Einheit und kurzer Beschreibung.
Diese Liste wird für ein Lovelace-Dashboard verwendet.

---

4) Lovelace-YAML generieren

Erzeuge ein vollständiges Lovelace-YAML für den ioBroker-Lovelace-Adapter
auf Basis dieser Entitätenliste.

Vorgaben:
- deutsche Beschriftungen
- Standard-Cards
- kompakte Übersicht
- vollständiger, direkt nutzbarer YAML-Code

---

5) Fehlerkorrektur

Dieses Lovelace-YAML erzeugt folgenden Fehler:
[Fehlermeldung inkl. Zeile/Spalte]

Hier ist der aktuelle YAML-Code.
Bitte korrigiere ihn und gib mir eine vollständig lauffähige Version zurück.

---

Ergebnis

Dieser Ablauf ermöglicht:

• schnelle Dashboard-Erstellung
• saubere Trennung von Logik und Darstellung
• einfache Anpassungen bei Änderungen
• reproduzierbare Ergebnisse

Der manuelle Aufwand reduziert sich auf fachliche Entscheidungen, während Syntax, Struktur und Iteration automatisiert erfolgen.

Hoffe dem ein oder anderen hilft das.