Bar Graph with relative energy consumption (network, sold, and solar consumed)

[luissimoes]

Perhaps this is interesting to someone else.
There are 3 entities:

• energy consumed from the network
• energy sold (surplus - this is the solar energy produced and not consumed)
• solar energy produced and consumed
  (I clearly should have a battery to store the extra solar... it will come soon ;-) )

This is the end result.

Details:

• the energy consumed ("from netz") is a sensor (comes from the meter)
• the energy sold is also a sensor (comes form the meter)
• the solar energy consumed is a template; its the difference between the solar produced and the "sold"

The graph is stapled and relative. I plotted the sold energy as negative.

Yaml for the graph

type: custom:plotly-graph
entities:
  - entity: sensor.from_netz_daily
    texttemplate: '%{y:.2f}'
    textfont:
      size: 13
      color: '#ffffff'
    name: from netz
    type: bar
    statistic: state
    period: day
    marker:
      color: '#cd0797'
      opacity: 1
    filters:
      - filter: i>0 && i < xs.length - 1
      - fn: |
          ({ys,xs,hass}) => ({
            xs: [...xs, new Date().setHours(0,0,0)],
            ys: [...ys, hass.states['sensor.from_netz_daily'].state],
          })
  - entity: sensor.to_netz_daily
    texttemplate: '%{y:.2f}'
    textfont:
      size: 12
    name: sold
    type: bar
    statistic: state
    period: day
    marker:
      color: '#0797cd'
      opacity: 0.9
    filters:
      - map_y_numbers: y *(-1)
      - filter: i>0 && i < xs.length - 1
      - fn: |
          ({ys,xs,hass}) => ({
            xs: [...xs, new Date().setHours(0,0,0)],
            ys: [...ys, hass.states['sensor.to_netz_daily'].state * (-1)],
          })
  - entity: sensor.solar_energy_consumed
    texttemplate: '%{y:.2f}'
    textposition: outside
    textfont:
      size: 12
    name: solar consumed
    type: bar
    statistic: state
    period: day
    marker:
      color: '#97cd07'
      opacity: 0.9
    filters:
      - filter: i>0 && i < xs.length - 1
      - fn: |
          ({ys,xs,hass}) => ({
            xs: [...xs, new Date().setHours(0,0,0)],
            ys: [...ys, hass.states['sensor.solar_energy_consumed'].state],
          })
  - entity: sensor.from_netz_daily
    type: indicator
    mode: number
    value: $ex ys.at(-1)
    bgcolor: black
    title:
      text: From Netz
      font:
        size: 8
    number:
      suffix: ' kWh'
      valueformat: '0.11'
      font:
        size: 14
        color: '#cd0797'
    domain:
      x:
        - 0.9
        - 1
      'y':
        - 0.9999
        - 1
  - entity: sensor.to_netz_daily
    type: indicator
    mode: number
    value: $ex ys.at(-1)
    bgcolor: black
    title:
      text: To Netz
      font:
        size: 8
    number:
      suffix: ' kWh'
      valueformat: '0.11'
      font:
        size: 14
        color: '#0797cd'
    domain:
      x:
        - 0
        - 0.2
      'y':
        - 0.9999
        - 1
layout:
  paper_bgcolor: rgba(0,0,0,0)
  plot_bgcolor: rgba(0,0,0,0)
  barmode: relative
  bargap: 0.2
  uniformtext:
    minsize: 12
    mode: show
  modebar:
    orientation: h
    remove: pan
  margin:
    t: 25
    l: 30
    r: 30
  height: 500
  legend:
    'y': -0.25
    x: 0.02
  xaxis:
    gridcolor: rgba(238,235,235,0.3)
    showgrid: true
    linewidth: 0
    linecolor: null
    nticks: 6
    tickformat: |-
      %d %b
      %Y
  yaxis:
    visible: false
hours_to_show: 5d
refresh_interval: auto
title: Consumed all - daily
card_mod:
  style: |
    ha-card {
        border-width: 0px;
       }
view_layout:
  grid-area: detail5

Template

{% set solar_prod = (states('sensor.solar_daily_energy') |float(0)/1000) %}
{% set energy_sold = states('sensor.to_netz_daily')|float(0) %}
{% set solar_consumed = (solar_prod - energy_sold) | float(0) %}

{% if solar_consumed <= 0 %}
  {{ 0 }}
{% else %}
  {{ solar_consumed }}
{% endif %}

[luissimoes]

Hi Sorry somehow this went to junk, then I didn’t check, then…. Sorry! So to your point: can it be that before 8th Mai you didn’t have “eigengebraucht”? Luis

…

On 8. May 2024, at 19:52, leon2908 ***@***.***> wrote: Hello, I really like the graphics. Great job. I wanted to use it in my Homeassistant but I can’t find my mistake here, can anyone help me? Thanks in advance. Greenshot.2024-05-08.19.47.32.png (view on web) <https://github.com/dbuezas/lovelace-plotly-graph-card/assets/1901976/f3ae73e9-dfec-444a-9d4b-376e1dc2eabb> Here is my Code: `type: custom:plotly-graph entities: entity: sensor.daily_energy_eigenverbrauch4 texttemplate: '%{y:.2f}' textfont: size: 13 color: '#ffffff' name: Vom Netz type: bar statistic: state period: day marker: color: '#E4443F' opacity: 0.9 filters: filter: i>0 && i < xs.length - 1 fn: | ({ys,xs,hass}) => ({ xs: [...xs, new Date().setHours(0,0,0)], ys: [...ys, hass.states['sensor.daily_energy_eigenverbrauch4'].state], }) entity: sensor.daily_energy_einspeisung texttemplate: '%{y:.2f}' textfont: size: 12 name: Verkauft type: bar statistic: state period: day marker: color: '#F1E1A6' opacity: 0.7 filters: map_y_numbers: y *(-1) filter: i>0 && i < xs.length - 1 fn: | ({ys,xs,hass}) => ({ xs: [...xs, new Date().setHours(0,0,0)], ys: [...ys, hass.states['sensor.daily_energy_einspeisung'].state * (-1)], }) entity: sensor.pv_eigennutzen_graf texttemplate: '%{y:.2f}' textposition: outside textfont: size: 12 name: Pv eigenverbraucht type: bar statistic: state period: day marker: color: '#97cd07' opacity: 0.75 filters: filter: i>0 && i < xs.length - 1 fn: | ({ys,xs,hass}) => ({ xs: [...xs, new Date().setHours(0,0,0)], ys: [...ys, hass.states['sensor.pv_eigennutzen_graf'].state], }) entity: sensor.daily_energy_eigenverbrauch4 type: indicator mode: number value: $ex ys.at(-1) bgcolor: black title: text: Vom Netz font: size: 8 number: suffix: ' kWh' valueformat: '0.11' font: size: 14 color: '#E4443F' domain: x: - 0.9 - 1 'y': - 0.9999 - 1 entity: sensor.daily_energy_einspeisung type: indicator mode: number value: $ex ys.at(-1) bgcolor: black title: text: Verkauft font: size: 8 number: suffix: ' kWh' valueformat: '0.11' font: size: 14 color: '#F1E1A6' domain: x: - 0 - 0.2 'y': - 0.9999 - 1 layout: barmode: relative bargap: 0.2 uniformtext: minsize: 12 mode: show modebar: orientation: h remove: pan margin: t: 25 l: 30 r: 30 height: 500 legend: 'y': -0.25 x: 0.02 xaxis: gridcolor: rgba(238,235,235,0.3) showgrid: true linewidth: 0 linecolor: null nticks: 6 tickformat: |- %d %b %Y yaxis: visible: false hours_to_show: 5d refresh_interval: auto title: Übersicht view_layout: grid-area: detail5 ` — Reply to this email directly, view it on GitHub <#379 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AKE3B7S2ZUSU4XGEQVIZJ3LZBJQ47AVCNFSM6AAAAABDWTWUU6VHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4TGNJYGQZDE>. You are receiving this because you authored the thread.