BMS Visualisierung - Battery Cell Card

Hallo zusammen,

ich nutze seit Juli 2025 HomeAssistant und habe mir im Sommer dann mit button-card und card-mod eine LiFePo4 Batterie-Visualisierung über Yamel zusammen gecoded!

Der Code war ellenlang und bei Änderungen musste ich den ganzen Code durchsuchen, daher habe ich mir eine richtige custom-card in Java geschrieben, so dass ich nach einem BMS-Wechsel nur die Sensoren im Yaml-Editor ersetzen/einsetzen musste!

Es gibt sehr viele Einstellmöglichkeiten und unbegrenzte Anzahl an Zellen können in dieser Karte angelegt werden!

Dazu kann eingestellt werden, ab wann Zellen in eine neue Zeile umbrechen (wer mehr als 8 Zellen hat), damit es auf Mobiltelefonen leserlich bleibt.

Achtung: Es handelt sich hier nicht um eine prozentuale Anzeige des Füllstandes, hier geht es viel mehr ums Monitoring der Zellspannung in mV der einzelnen Zellen!

Der SOC-Wert kann aber natürlich auch angezeigt werden!

Das Balancing kann entweder über einen Sensor gemeldet werden, oder manuell eingestellt werden (falls kein Sensor vorhanden! Das syncronisierungszeichen zeigt dann dementsprechend an, ob das balancing aktiv ist (Im Screenschot habe ich es in manchen Karten auf 0mV gestellt damit es ersichtlich ist.

Die Anzeige der höchsten und niedrigsten Zelle ist ebenfalls zuschaltbar, sofern Sensoren vorhanden sind (oder ein entsprechendes Template, dass die jeweiligen Sensoren ermittelt).

Es ist BMS (Hersteller-) unabhängig, da die Karte nur die entsprechenden Sensoren benötigt.

Mal schauen ob interesse besteht.

Anbei ein Screenshot, wie die Karte ausschauen kann.

Grüße Jinx

PS.: ich arbeite auch gerade an einer fuel-tank-card zur visualisierung des Heizöltank-Füllstandes, da ich dazu auch noch nichts für mich brauchbares gefunden habe! Hab ich aber auch erst gestern mit angefangen! (man kann natürlich auch andere Flüssigkeiten eintragen, Flüssiggas, Wasser etc….)

1 „Gefällt mir“

naja das interesse scheint hier nicht wirklich groß zu sein, wer es testen möchte:

Also mich interessiert es schon…
Genau so etwas habe ich gesucht. Allerdings komme ich irgendwie nicht weiter. Ich habe die Installationsschritte befolgt, finde dann aber nirgends die Karte, um sie einem Dashboard hinzu zu fügen… Bin aber auch noch ziemlich unbedarft, was HA angeht…
Wenn du also einen Tip hast…

Ich wollte es testen.
Auf der github-Seite funktioniert der Link zur deutschen Beschreibung nicht (Bindestrichanzahl prüfen).

Nach der Installation fiel mir gleich ein Probleme mit Umlauten auf:

Warum ist die Karte so dunkel?

Wenn die Schritte der installation befolgt wurden, kann die Karte übercdas editieren des Dashboards hinzugefügt werden!

Oben rechts auf den Stift, dann im Dashboard auf das “+” drücken und das Menü der Kartenauswahl öffnet sich. In der suche oben “batter…” eingeben und sie müsste auswählbar sein!

Und nicht vergessen der Browser neu laden!

1 „Gefällt mir“

Ich nutze den Dark Style, kannst den Hintergrund im Editor ändern! Die Zellen sind dunkel, da dort noch keine Sensoren zugewiesen sind!

Danke für den Hinweis zur Verlinkung - ich hatte die Überschrift editiert und vergessen den Link anzupassen.

Das mit der Umlauten-Anzeige habe ich jetzt nicht, wird aber nach der einbettung des visuellen Editors nicht mehr relevant! Ist ja nur ein Hinweis-Text

Leider gibt das BMS in meinem Akkupac die Werte der Zellen nicht einzeln aus. Ich bekomme nur die Zelle mit der höchsten bzw. niedrigsten Spannung (inklusive deren Spannungswert) übermittelt. Schade eigentlich.

Waa hast du für ein bms verbaut?

Ja die einzelnen Zellenwerte müssen schon zu HA übertragen werden! Ohne sensoren, keine Anzeige!

Ich habe meinen Akkupack von Voltsmile noch nicht aufgeschraubt. War bisher nicht nötig. Die Werte kommen auch nicht direkt vom BMS, sondern werden über die HA-Victron-Integration beim CerboGX ausgelesen.

Hallo, habe ich alles gemacht, aber ohne Erfolg. Ich finde die Karte nicht. Muss evtl. noch ein anderes AddOn installiert sein, dass es funktioniert?

Worüber konfigurierst du HA? Je nach Browser musst du schauen, dass du den cache neu geladen bekommst! Wenn du die App nutzt, die App beenden, den Cache (nicht die Daten!!) einmal löschen und HA neu aufrufen.

Sonst teste mal anders: erstelle eine neue manuelle Karte (die ist dann leer) und trage den YamlCode ein!

@Radiocarbonat hab dir eine PN geschickt!

Für die Visualisierung der einzelnen Zellen sind leider nun mal auch die einzelnen Zell-Werte erforderlich!

Hallo Jinx, ich arbeite mit einem Mac. Cache habe ich gelöscht über das Menü Entwickler → Cache-Speicher leeren. Den YAML Code habe ich auch schon versucht zu nutzen, bekomme dann aber die Fehlermeldung: Custom element doesn’t exist: battery-cells-card.
Und den Dateinamen habe ich auch geprüft: battery-cells-card.js, sollte ja passen.
Auch ein Neustart von HA hilft nicht.

@AndiG schau mal in den Einstellungen unter Dashboard → dann oben rechts die 3 Punkte → Ressourcen, da musste die Karte eingetragen sein!

/local/battery-cells-card.js JavaScript-Modul

ist das so bei dir ersichtlich?

ja genau so steht es in der Liste.

Ich habe mal mit dem file editor in “battery-cells-card.js” nach “battery-cell” gesucht. Da findet man etliche Male “battery-cell” aber auch “battery-cells”. Ist das beabsichtigt?

Habe meinen Fehler gefunden. Datei nicht als .js runter geladen sondern als html… Sorry!

Es gibt auch ein Problem mit Umlauten / Sonderzeichen in der Darstellung: Das “Delta” (Dreieckssymbol) bei der Spannungsdifferenz wird nicht korrekt dargestellt.


Sonst gefällt mir die Darstellung aber gut. Danke dafür!

:crayon:by HarryP: Zusammenführung Mehrfachpost (bei Änderungen oder hinzufügen von Inhalten bitte die „Bearbeitungsfunktion“ anstatt „Antworten“ zu nutzen)

1 „Gefällt mir“

Danke für dein Feedback, ich denke es wird am WE noch ein Update geben!

  1. Fix für HA-Theme (keinen fest definierten Hintergrund) :white_check_mark:
  2. Fix für das Delta :white_check_mark:
  3. Fix für den Kommentar im visuelen (noch nicht vorhandenen) visuellen Editor. :white_check_mark:
  4. Fix: Wenn Sensorwete der Zellen in Volt übergeben werden, ist die Zustandsanzeige Fehlerhaft! :cross_mark: ( noch offen)

Schick wäre noch, wenn man die Spannungswerte zur Abgrenzung der Farbbereiche frei konfigurieren könnte.
Und weitere Frage: Was genau muss ein Sensor liefern für pack_cell_low und pack_cell_high? Ich habe mir ein template geschrieben, das die entity_id der entsprechenden Zellen liefert, aber das scheint nicht hinzuhauen. Die blaue bzw. rote Umrandung wird nicht angezeigt.

das schicke kommt eventuell später! :wink:
Die Sensoren für Low und high liefern bei mir zumindest nur die Nummer der Zelle!

Es gibt im übrigen ein Update Version v0.5.3 online!
(Einheit von mV und V umstellbar und der Bug" falschberechnung des Füllstandes bei V-Sensorwerten sollte hiermit behoben sein)

Wenn du möchtest schicke ich dir eine vor-ab-version v.0.5.4.beta zum testen, mit der internen Berechnung von low und high, wenn keine Sensoren eingetragen sind!?
Da sparst du dir das Template!

(oder du kopierst den aktuellen Code aus der battery-cells-card.js (Github) in deine hinein)

PS: Am besten bitte dann die Karte NEU anlegen, damit beim erstellen, die neuen Einträge im Yaml-Editor gesetzt werden, oder du editierst es per Hand

Ist ja wie Weihnachten :grin:
Wäre an der v.0.5.4.beta sehr interessiert. Danke für das Angebot!

dann teste mal… (v.0.5.4.beta)
battery-cells-card.txt (26,0 KB)
musst die Datei umbennen von txt zu js