Diagramm zur Energienutzung-Karte anpassen

Allgemein & News
1

Hallo Zusammen,

ich bekomme es leider nicht hin die Grafik ist klasse.

Hätte die aber gerne noch 2 mal und zwar einmal nurt Anzeige Strom Waermepumpe und einmal der regulärer Strom. Es sind 2 Zähler mit unterschiedlichen Tarifen. Mir geht es einfach darum das ich getrennt sehe wann die Wärmepumpe die höchstlast hatte und wann Sie z.B. überhaupt Strom zieht. Das Balkendiagramm finde ich da halt extrem gut. Habe anhand der ersten Grafik wa ja beides aufeinander ist z.B. auch schon festgestellt das die Wärmepumpe um 4 gelaufen ist obwohl nachts kein Heizungsprogramm und Warmwasserprogramm aktiv ist. Dem muss ich die Tage gleich mal auf die Versen gehen.

Danke euch für die Aufnahme und hoffentlich Hilfe.

Grüße Philipp

grafik
grafik1124×523 35.1 KB

2

Willkommen hier im Forum!
Ich verwende die custom:plotly-graph für so was sieht sehr ähnlich aus nur habe ich die Balken nebeneinander!

Bildschirmfoto zu 2026-04-06 18-14-28
Bildschirmfoto zu 2026-04-06 18-14-281296×440 27.5 KB

Hier wäre der yaml Code dazu! Brauchst du nur noch an deinen entities anpassen

type: custom:plotly-graph
defaults:
  yaxes:
    fixedrange: true
  entity:
    period: day
    type: bar
    statistic: state
    texttemplate: "%{y:.1f}"
    textposition: auto
    filters:
      - filter: i>0
entities:
  - entity: sensor.vrm_today_solar_yield
    name: PV Tagesertrag
  - entity: sensor.vrm_today_consumption
    name: Verbrauch
    marker:
      color: null
      opacity: 2
layout:
  paper_bgcolor: rgba(0,0,0,0)
  plot_bgcolor: rgba(0,0,0,0)
  barmode: group
  bargap: 0.2
  barcornerradius: 5
  uniformtext:
    minsize: 10
    mode: show
  modebar:
    orientation: v
    remove: zoom
  margin:
    t: 15
    l: 45
    r: 20
  height: 380
  legend:
    "y": -0.25
    x: 0.02
  xaxis:
    rangeselector:
      "y": 1.15
      buttons:
        - count: 1
          step: month
        - count: 14
          step: day
        - count: 7
          step: day
    gridcolor: rgba(238,235,235,0.3)
    autorange: true
    showgrid: true
  yaxis:
    visible: true
    autorange: true
hours_to_show: 14d
refresh_interval: 15
card_mod:
  style: |
    ha-card {
        border-width: 0px;
        padding-top: 20px;
       }
view_layout:
  position: main
grid_options:
  columns: full
1 „Gefällt mir“
3

Anderen Lösung gäbe es auch noch mit Detailed Charts Panel, dort kannst du den Grafen einfach erstellen und leicht anpassen wie du ihn haben möchtest ohne viel in yaml zu machen!

Könnte dann so z.B. aussehen!

Bildschirmfoto zu 2026-04-06 18-41-22
Bildschirmfoto zu 2026-04-06 18-41-22959×406 21.9 KB

4

Und hier noch eine Möglichkeit: Custom Energy Graph

Nutzt die gleiche Engine wie das Energie-Dashboard, und ist im Wesentlichen graphisch konfigurierbar, nutzt sogar den Date-Picker des Energy-Dashboards.

Die Parte kann nicht so viel wie Plotly oder das Detailed Charts Panel, ist aber einfach zu konfigurieren, und hat halt den gleichen Stil wie das Energy-Dashboard.

5

Vielen Dank für die Antworten. Habe es über das Standard Statistikdiagramm gelöst bekommen:

grafik
grafik622×783 67.4 KB