262 lines
6.4 KiB
Markdown
262 lines
6.4 KiB
Markdown
# 📊 Batterie-Optimierung Dashboard Überarbeitung
|
|
|
|
## 🎯 Übersicht
|
|
|
|
Ich habe **3 Dashboard-Varianten** erstellt, alle mit **maximal 4 Spalten** für bessere Übersichtlichkeit:
|
|
|
|
### 1. **Standard-Version** (`battery_optimizer_dashboard.yaml`)
|
|
- **Am umfangreichsten**: Alle Features und Details
|
|
- **Beste Wahl für**: Desktop-Nutzung, Detailanalyse
|
|
- **Highlights**:
|
|
- Power Flow Card Plus für Energie-Visualisierung
|
|
- 3 Plotly Graphen (Preis, SOC, Energie-Flüsse)
|
|
- Vollständige Plan-Tabelle mit Statistiken
|
|
- System-Informationen ausklappbar
|
|
|
|
### 2. **Kompakt-Version** (`battery_optimizer_dashboard_compact.yaml`)
|
|
- **Ausgewogen**: Kompakt aber vollständig
|
|
- **Beste Wahl für**: Tablet, ausgewogene Darstellung
|
|
- **Highlights**:
|
|
- Stack-in-Card für platzsparendes Layout
|
|
- 2 Plotly Graphen (Preis + SOC kombiniert)
|
|
- Bubble Cards für moderne Optik
|
|
- Kompakte Plan-Anzeige
|
|
|
|
### 3. **Minimal-Version** (`battery_optimizer_dashboard_minimal.yaml`)
|
|
- **Am übersichtlichsten**: Nur das Wichtigste
|
|
- **Beste Wahl für**: Smartphone, Quick-Check
|
|
- **Highlights**:
|
|
- Quick Status Bar (3 Bubble Buttons)
|
|
- Nächste 5 Ladungen im Fokus
|
|
- 2 kleine Graphen (Preis + SOC)
|
|
- Schnelleinstellungen nur wenn aktiv
|
|
|
|
---
|
|
|
|
## 📦 Installation
|
|
|
|
### Schritt 1: Dashboard in Home Assistant importieren
|
|
|
|
```yaml
|
|
# In deiner Home Assistant Konfiguration (configuration.yaml oder dashboards.yaml)
|
|
lovelace:
|
|
mode: yaml
|
|
dashboards:
|
|
battery-optimizer:
|
|
mode: yaml
|
|
filename: dashboards/battery_optimizer_dashboard.yaml
|
|
title: Batterie Optimierung
|
|
icon: mdi:battery-charging
|
|
show_in_sidebar: true
|
|
```
|
|
|
|
### Schritt 2: Datei hochladen
|
|
|
|
1. Kopiere eine der YAML-Dateien nach: `/config/dashboards/`
|
|
2. Oder: Füge den Inhalt direkt in den Dashboard-Editor ein
|
|
3. Neustart von Home Assistant (eventuell nötig)
|
|
|
|
### Schritt 3: Fehlende Entities anpassen
|
|
|
|
**Wichtig:** Passe folgende Entity-IDs an deine tatsächlichen IDs an:
|
|
|
|
```yaml
|
|
# Beispiele - ersetze durch deine tatsächlichen IDs:
|
|
sensor.openems_ess0_activepower # Batterie-Leistung
|
|
sensor.esssoc # Batterie SOC
|
|
sensor.openems_grid_activepower # Netz-Leistung
|
|
sensor.openems_production_activepower # PV-Produktion
|
|
sensor.openems_consumption_activepower # Verbrauch
|
|
sensor.hastrom_flex_extended_current_price # Strompreis
|
|
sensor.battery_charging_plan_status # Plan-Status
|
|
sensor.battery_next_charge_time # Nächste Ladung
|
|
```
|
|
|
|
---
|
|
|
|
## 🎨 Verwendete Custom Cards
|
|
|
|
Diese HACS-Karten werden verwendet:
|
|
|
|
### ✅ **Installiert bei dir:**
|
|
1. **Bubble Card** - Moderne Button- und Toggle-Cards
|
|
2. **Plotly Graph Card** - Professionelle interaktive Graphen
|
|
3. **Power Flow Card Plus** - Energie-Fluss-Visualisierung
|
|
4. **Stack-in-Card** - Kompaktes Stapeln von Cards
|
|
|
|
### 📋 **Falls noch nicht installiert:**
|
|
|
|
```bash
|
|
# In HACS → Frontend → Suche nach:
|
|
- Bubble Card
|
|
- Plotly Graph Card
|
|
- Power Flow Card Plus
|
|
- Stack-in-Card
|
|
```
|
|
|
|
---
|
|
|
|
## 🔧 Anpassungen
|
|
|
|
### Layout ändern
|
|
|
|
```yaml
|
|
# Von 4 auf 3 Spalten ändern (in horizontal-stack):
|
|
- type: horizontal-stack
|
|
cards:
|
|
- card1 # Spalte 1
|
|
- card2 # Spalte 2
|
|
- card3 # Spalte 3 (entferne 4. Card)
|
|
```
|
|
|
|
### Farben anpassen
|
|
|
|
```yaml
|
|
# In Plotly Graphen:
|
|
line:
|
|
color: '#FF9800' # Deine Wunschfarbe (Hex)
|
|
```
|
|
|
|
### Graph-Zeitraum ändern
|
|
|
|
```yaml
|
|
hours_to_show: 48 # Von 48h auf z.B. 24h ändern
|
|
```
|
|
|
|
---
|
|
|
|
## 📱 Responsive Verhalten
|
|
|
|
### Automatische Anpassung
|
|
|
|
Alle Dashboards passen sich automatisch an:
|
|
|
|
- **Desktop** (>1024px): Volle Breite, alle Spalten
|
|
- **Tablet** (768-1024px): 2-3 Spalten, kompaktere Ansicht
|
|
- **Smartphone** (<768px): 1 Spalte, vertikales Stacking
|
|
|
|
### Mobile Optimierungen
|
|
|
|
Die **Minimal-Version** ist speziell für Smartphones optimiert:
|
|
- Große Touch-Targets (Bubble Cards)
|
|
- Weniger Scroll-Bedarf
|
|
- Schneller Überblick
|
|
|
|
---
|
|
|
|
## 🎯 Empfohlene Nutzung
|
|
|
|
| Gerät | Dashboard-Version | Warum? |
|
|
|-------|-------------------|--------|
|
|
| Desktop PC | **Standard** | Volle Details, alle Graphen sichtbar |
|
|
| Tablet | **Kompakt** | Ausgewogen zwischen Detail und Übersicht |
|
|
| Smartphone | **Minimal** | Quick-Check, wichtigste Infos |
|
|
| Wall Panel | **Kompakt** oder **Minimal** | Übersichtlich aus der Distanz |
|
|
|
|
---
|
|
|
|
## 🐛 Fehlerbehebung
|
|
|
|
### Problem: Cards werden nicht angezeigt
|
|
|
|
**Lösung:**
|
|
1. Prüfe ob alle Custom Cards installiert sind (HACS)
|
|
2. Lösche Browser-Cache
|
|
3. Neustart Home Assistant
|
|
|
|
### Problem: Entities nicht gefunden
|
|
|
|
**Lösung:**
|
|
```yaml
|
|
# In Developer Tools → States nachschauen:
|
|
# Welche Entity-IDs existieren wirklich?
|
|
# Dann im Dashboard anpassen
|
|
```
|
|
|
|
### Problem: Plotly Graph zeigt keine Daten
|
|
|
|
**Lösung:**
|
|
```yaml
|
|
# Prüfe ob die Entity historische Daten hat:
|
|
# Developer Tools → History → Entity auswählen
|
|
# Falls nicht: InfluxDB/Recorder-Integration prüfen
|
|
```
|
|
|
|
---
|
|
|
|
## 📊 Dashboard-Vergleich
|
|
|
|
| Feature | Standard | Kompakt | Minimal |
|
|
|---------|----------|---------|---------|
|
|
| Power Flow Card | ✅ | ✅ | ✅ |
|
|
| Preis-Graph | ✅ | ✅ | ✅ (klein) |
|
|
| SOC-Graph | ✅ | ✅ | ✅ (klein) |
|
|
| Energie-Fluss-Graph | ✅ | ❌ | ❌ |
|
|
| Detaillierte Plan-Tabelle | ✅ | ✅ | ❌ |
|
|
| Plan-Statistiken | ✅ | ✅ | ❌ |
|
|
| Nächste Ladungen | ✅ | ✅ | ✅ |
|
|
| System-Infos | ✅ | ✅ | ✅ (minimal) |
|
|
| Schnelleinstellungen | ✅ | ✅ | ✅ (conditional) |
|
|
| Bubble Cards | ✅ | ✅✅ | ✅✅✅ |
|
|
| Stack-in-Card | ❌ | ✅✅ | ❌ |
|
|
|
|
---
|
|
|
|
## 🔮 Nächste Schritte
|
|
|
|
Nach der Dashboard-Installation kannst du:
|
|
|
|
1. **Plan-Historie implementieren** (wie im vorherigen Chat besprochen)
|
|
2. **InfluxDB-Integration** für Langzeit-Datenanalyse
|
|
3. **Notifications** bei Ladestart/-ende
|
|
4. **Grafana-Dashboard** für erweiterte Analysen
|
|
|
|
---
|
|
|
|
## 💡 Tipps
|
|
|
|
### Performance-Optimierung
|
|
|
|
```yaml
|
|
# Reduziere refresh_interval bei Plotly:
|
|
refresh_interval: 300 # Nur alle 5 Minuten aktualisieren
|
|
```
|
|
|
|
### Conditional Cards
|
|
|
|
```yaml
|
|
# Zeige Card nur wenn Optimizer aktiv:
|
|
- type: conditional
|
|
conditions:
|
|
- entity: input_boolean.battery_optimizer_enabled
|
|
state: 'on'
|
|
card:
|
|
# Deine Card hier
|
|
```
|
|
|
|
### Dark Mode Anpassungen
|
|
|
|
```yaml
|
|
# In card_mod für bessere Lesbarkeit:
|
|
card_mod:
|
|
style: |
|
|
ha-card {
|
|
background: rgba(0, 0, 0, 0.3);
|
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## 📞 Support
|
|
|
|
Bei Fragen oder Problemen:
|
|
|
|
1. Prüfe die **Entity-IDs** in Developer Tools
|
|
2. Schaue in die **Browser-Konsole** (F12) nach Fehlern
|
|
3. Prüfe das **Home Assistant Log**
|
|
|
|
---
|
|
|
|
**Viel Erfolg mit deinem neuen Dashboard! 🚀**
|