Dashboard Widget Energy Overview

Energie-Dashboard in openHAB MainUI – erster Entwurf

Hallo zusammen,

ich wollte einmal mein aktuelles Energie-Dashboard vorstellen, das ich mir für meine openHAB-Installation gebaut habe.

Vorweg: Das Dashboard ist kein fertiges, standardisiertes Widget-Paket und aktuell auch nicht als Veröffentlichung geplant. Es ist sehr stark auf meine eigene Installation, meine Items und meine Art der Energiebilanz zugeschnitten. Ich möchte es hier eher zeigen, um Feedback, Meinungen und vielleicht Verbesserungsideen zu bekommen.

Das Design und die Struktur habe ich mit Unterstützung von KI entwickelt und dann Schritt für Schritt an meine openHAB-Umgebung angepasst. Ziel war ein kompaktes Energie-Cockpit, das optisch ein wenig in Richtung Victron/ESS-Anzeige geht, aber vollständig in der openHAB MainUI umgesetzt ist.

Was das Dashboard aktuell zeigt

Im oberen Bereich sieht man die wichtigsten Live-Werte:

  • aktueller Netzbezug bzw. Netzsaldo
  • aktuelle Solarleistung
  • aktueller Hausverbrauch
  • Batteriestatus mit SOC
  • Lade- und Entladeleistung der Batterie
  • Einzelwerte der beiden Batteriemodule
  • Spannung, Temperatur und Status der Batterie

Darunter gibt es eine kompakte Tagesübersicht mit Kennzahlen wie:

  • Solar heute
  • Netzbezug heute
  • Verbrauch heute
  • Eigenverbrauch / Eigennutzung

Die Werte kommen bei mir aus verschiedenen Quellen, unter anderem Shelly EM3, Shelly Plug S, Victron/MPPT-Daten, Pylontech-Batterie über MQTT sowie berechneten openHAB-Items.

Technischer Aufbau

Das Ganze ist aktuell als openHAB MainUI Custom Widget aufgebaut. Es besteht im Wesentlichen aus YAML, Framework7-Komponenten und openHAB-Komponenten. Für die Optik werden viele eigene Styles direkt im Widget verwendet.

Ich habe bewusst nicht versucht, daraus direkt ein allgemein nutzbares Widget zu machen, weil bei mir sehr viele Itemnamen, Berechnungen und Datenflüsse individuell sind. Zum Beispiel sind die Tageswerte, Batterie-Items und Solarwerte in meiner Installation speziell benannt und teilweise über eigene Rules berechnet.

Deshalb wäre eine Veröffentlichung im jetzigen Zustand wahrscheinlich nur begrenzt hilfreich, weil man sehr viel anpassen müsste.

Warum ich es trotzdem zeige

Mich würde interessieren, wie ihr das Konzept findet:

  • Ist die Darstellung verständlich?
  • Wirkt das Dashboard übersichtlich oder zu technisch?
  • Würdet ihr eher mehr Detailwerte anzeigen oder eher weiter reduzieren?
  • Ist der Victron-ähnliche Ansatz in der MainUI sinnvoll?
  • Welche Bereiche würdet ihr noch ergänzen, z. B. Wochenverlauf, Monatswerte, Phasenansicht oder einzelne Verbraucher?

Mir ging es vor allem darum, die wichtigsten Energiewerte auf einem Tablet/Kiosk-Display schnell erfassen zu können, ohne immer in einzelne Charts oder Analyzer springen zu müssen.

Wie gesagt: Das ist aktuell eher ein persönlicher Entwurf als ein fertiges Community-Widget. Aber vielleicht ist es für andere trotzdem interessant als Idee oder Inspiration.

Feedback ist willkommen.

English please, this is an international community !

Hello everyone,

I would like to share my current energy dashboard, which I built for my openHAB installation.

First of all: this dashboard is not a finished or standardized widget package, and at the moment I do not plan to publish it as a ready-to-use solution. It is strongly tailored to my own installation, my item structure, and my personal way of visualizing the energy balance.

I mainly want to show it here to get feedback, opinions, and maybe some ideas for improvement.

The design and structure were developed with the help of AI and then adjusted step by step to fit my openHAB environment. The goal was to create a compact energy cockpit with a look somewhat inspired by Victron/ESS displays, but implemented completely within the openHAB MainUI.

What the dashboard currently shows

The upper area shows the most important live values:

  • current grid import / grid balance
  • current solar power
  • current house consumption
  • battery status with SOC
  • battery charging and discharging power
  • individual values of the two battery modules
  • battery voltage, temperature, and status

Below that, there is a compact daily overview with values such as:

  • solar production today
  • grid import today
  • consumption today
  • self-consumption / self-use

The values in my setup come from several different sources, including Shelly EM3, Shelly Plug S, Victron/MPPT data, Pylontech battery data via MQTT, and calculated openHAB items.

Technical structure

At the moment, the dashboard is built as an openHAB MainUI custom widget. It mainly consists of YAML, Framework7 components, and openHAB components. A lot of the visual styling is done directly inside the widget.

I deliberately did not try to turn this into a generally usable widget right away, because many item names, calculations, and data flows are very specific to my own setup. For example, the daily values, battery items, and solar values in my installation are named individually and are partly calculated by custom rules.

Because of that, publishing it in its current state would probably only be of limited use, since it would require quite a lot of adaptation.

Why I am sharing it anyway

I would be interested to hear what you think about the concept:

  • Is the visualization easy to understand?
  • Does the dashboard look clear, or is it too technical?
  • Would you show more detailed values or reduce it even further?
  • Does this Victron-inspired approach make sense in the MainUI?
  • What else would you add, for example weekly history, monthly values, phase view, or individual consumers?

My main goal was to make the most important energy values quickly visible on a tablet or kiosk display, without always having to open separate charts or the Analyzer.

As mentioned, this is currently more of a personal draft than a finished community widget. But maybe it can still be useful as an idea or inspiration for others.

Feedback is welcome.

cool design!

Very good idea, looks stylish, I haven’t seen anything like it, thanks for the photo.

Indeed, but it’s lacking the weapons display.
Something like ‘Start the washing NOW’ :grinning_face_with_smiling_eyes:

Yes this really reminds me of the hud of a space simulation game. Very cool though, I think this would be a great addition to the widget marketplace if you’re willing to share the code.

Thank you all for the nice feedback!

Yes, I also had to smile when I saw the “space simulation HUD” comparison. That was not the original goal, but I can definitely see the resemblance now. Maybe the “Start washing NOW” weapon display has to become the next widget section. :grinning_face_with_smiling_eyes:

Regarding sharing the code: I’m not against it in principle. At the moment, however, the widget is still very specific to my own setup. Many item names, calculations, battery values and solar values are directly tied to my openHAB installation, so it is not yet something that could simply be installed and used by others.

If there is interest, I can try to clean it up a bit and maybe prepare a more generic version with configurable props. I would probably need to separate the design from my own item structure first, so that others can map their own items more easily.

For now, I mainly wanted to share the idea and get some feedback on the concept and layout. But your comments are very motivating, so maybe I’ll take a closer look at making it shareable for the widget marketplace later on.

I’m pretty sure Claude could do that for you in a few seconds :wink:

But no worries, take your time and release it when you’re happy with it. Or don’t :wink:

I’d actually like to share it at some point. I also have a few other ideas in the pipeline that I’d like to develop further once they are a bit more mature and ready to show.

Right now, I’m not fully happy with the overall dashboard concept yet. I’d like to have more freedom and flexibility in how the information is arranged and displayed. But I guess that won’t be the easiest part. :grinning_face_with_smiling_eyes: