Koala Sankey diagram

[Brett-S-OWB]

Das Sankey-Diagramm wurde dem oberen Karussell als separate Slide hinzugefügt.

Das Sankey-Diagramm visualisiert die aktuellen Energieflüsse und zeigt, welcher Anteil jeder Quelle – PV, Netz, Speicher – auf welche Senke – Haus, Ladepunkte, Speicher – entfällt.

Abhängigkeit: Dieser PR gehört zu openWB/openwb-ui-settings#1071 im Settings-Repository und sollte gemeinsam mit diesem gemergt werden. Dort wird das Sankey-Diagramm in die Sortierung der oberen Karussell-Slides aufgenommen.

Bei Hybrid-Wechselrichtern lädt der Speicher direkt per DC aus der eigenen PV. Das Diagramm erkennt dies an der Gerätehierarchie (Speicher als Kind des Wechselrichters) und ordnet die Speicherladung zuerst der PV zu – statt sie anteilig auf alle Quellen zu verteilen.

Wenn mehr als drei Ladepunkte konfiguriert sind, werden die Ladepunkte zu einem einzigen Sink mit der Bezeichnung „Ladepunkte“ zusammengefasst.

plugin:
Für das Diagramm nutzen wir das Chart.js-Plugin chartjs-chart-sankey (npm-Paket). Trotz niedriger Versionsnummer wird es von kurkle, einem der Chart.js-Kernentwickler, gepflegt – wir bleiben damit innerhalb einer Bibliothek.

Eigener Code (Hover & Beschriftung):

Ergänzt wurde eigener Code für zwei Dinge:

Hervorhebung beim Überfahren: Der Fluss unter dem Cursor bleibt farbig, alle anderen Flüsse und ihre Beschriftungen werden ins Graue abgedunkelt.
Die Hover-Hervorhebung des Sankey-Plugins ist sehr dezent. Daher wurde ein eigener, deutlicherer Hover-Fokus für eine bessere Visualisierung implementiert.

Wertbeschriftung: Jeder Fluss trägt seine Leistung mit nachgestellter Einheit (z. B. „6,90 kW"); überlappende Labels werden entlang des Flusses versetzt, der Rest per Tooltip gezeigt.

Die Schriftart für die Chart-JS im Koala-Theme wurde global angepasst, sodass sie nun mit der Schriftart der restlichen Anwendung übereinstimmt.

Hover:

Label Verschiebung:

Tooltip:

Ladepunkt-Zusammenführung.

Slide Reinfolge einstellbar unter Einstellungen:

[tpd-opitz]

Wie werden denn die Endpunkte an den Seiten sortiert?

Ich hätte gern eine Sortierung nach der aktuellen Leistung.
@Brett-S-OWB:

• wäre das einfach umsetzbar?
• würde es die Darstellung an den Kreuzungen verbessern, wenn man die Eingänge absteigend und die Ausgänge aufsteigend sortiert?

[Brett-S-OWB]

Wie werden denn die Endpunkte an den Seiten sortiert?

Ich hätte gern eine Sortierung nach der aktuellen Leistung. @Brett-S-OWB:

• wäre das einfach umsetzbar?
• würde es die Darstellung an den Kreuzungen verbessern, wenn man die Eingänge absteigend und die Ausgänge aufsteigend sortiert?

Aktuell setzen wir keine eigene Sortierung – die Knoten werden vom Plugin anhand des Fluss-Graphen platziert, nicht nach Leistung. Eine Sortierung nach aktueller Leistung ist aber relativ einfach umsetzbar: Das Plugin bietet dafür eine priority-Option pro Knoten die wir aus den Leistungswerten befüllen können. Das Plugin ordnet die Knoten aktuell schon so an, dass Kreuzungen möglichst vermieden werden – eine Sortierung nach Leistung kann in manchen Fällen zusätzlich helfen, aber nicht zwangsläufig. Für die Übersichtlichkeit fassen wir zudem ab mehr als drei Ladepunkten/Verbrauchern diese zusammen, und beim Überfahren eines Flusses werden die übrigen abgedunkelt, sodass sich einzelne Pfade gut verfolgen lassen. Ich probiere die Sortierung aber aus und schaue, ob sie die Darstellung verbessert.

[Brett-S-OWB]

Source- und Sink-Nodes nach der aktuellen Leistung sortiert für eine klarere Darstellung.
Commit: 89a441b

[tpd-opitz]

Ich hätte gern eine Sortierung nach der aktuellen Leistung.

Nach ein paar Tagen im Betrieb muss ich zugeben, dass die dynamische Sortierung nach Leistung keine gute Idee war.
Eine feste Reihenfolge scheint mir jetzt sinnvoller:

• Quellen
  1. PV
  2. Akku
  3. Ladepunkte (V2H)
  4. Netz
• Senken
  1. Haus
  2. Verbraucher (nicht in Haus inkludiert)
  3. Akku
  4. Ladepunkte
  5. Netz