Bar graph thin as a line - and with fn function repeats last month

[luissimoes]

(I posted it in the wrong forum - so putting it here now)

I need your help - I did this for other graphs and works but now I can't make this work...

I am doing a graph for the energy consumption (for 2 tariffs - standard and go). I created the sensors with utility meter etc...

Here is the code.
This produces a very narrow bar (I only have for this month)

entities:
  - entity: sensor.monthly_energy_go
    name: monthly energy go
    statistic: state
    type: bar
    period: month
    marker:
      color: "#57EB70"
      opacity: 1
    texttemplate: "%{y:.2f}"
    textfont:
      size: 11
      color: "#000000"
  - entity: sensor.monthly_energy_standard
    name: monthly energy standard
    statistic: sum
    period: month
    type: bar
    marker:
      color: "#EB57D2"
      opacity: 1
    texttemplate: "%{y:.2f}"
    textfont:
      size: 11
      color: "#000000"
layout:
  paper_bgcolor: rgba(0,0,0,0)
  plot_bgcolor: rgba(0,0,0,0)
  barmode: relative
  bargap: 0.1
  uniformtext:
    minsize: 9
    mode: show
  modebar:
    orientation: v
    remove: pan
  margin:
    t: 30
  height: 400
  legend:
    "y": -0.4
    x: -0.1
    font:
      size: 10
  hovermode: x
  xaxis:
    gridcolor: rgba(238,235,235,0.6)
    showgrid: false
    showspikes: True,
    spikethickness: 2
    spikedash: dot
    spikecolor: "#999999"
    spikemode: across
  yaxis:
    gridcolor: rgba(238,235,235,0.2)
    linecolor: null
    title:
      font:
        size: 9
        color: "#038037"
      text: kWh
    tickfont:
      color: "#038037"
card_mod:
  style: |
    ha-card {
        border-width: 0px;
       }
refresh_interval: auto
title: Monthly Energy
hours_to_show: 120d

I added the code to each entity (so I added 'sensor.monthly_energy_standard' for the other entity - and now the graph is better from width ... BUT the month of June is there as a copy of May

    filters:
      - fn: |
          ({ys,xs,hass,}) => ({
            xs: [...xs, +xs.at(-1)+1000*60*60*24*7*4],
            ys: [...ys, hass.states['sensor.monthly_energy_go'].state],
          })

Can you please help?

thanks

[luissimoes]

So,
I tried something new (not fully understand why this changed, as I dont understand why "integrate" on a monthly Statistic over a month is different than the statistic itself...?)
and now I have one bar (as it should) but not centred.

I added

      - integrate:
          reset_every: 30d
          unit: m
      - resample: 30d

And go this

entities:
  - entity: sensor.monthly_energy_go
    name: monthly energy go
    statistic: state
    period: month
    type: bar
    marker:
      color: "#57EB70"
      opacity: 1
    texttemplate: "%{y:.2f}"
    textfont:
      size: 11
      color: "#000000"
    filters:
      - integrate:
          reset_every: 1M
          unit: m
      - resample: 1M
      - fn: |
          ({ys,xs,hass,}) => ({
            xs: [...xs, +xs.at(-1)+1000*60*60*24*7*4],
            ys: [...ys, hass.states['sensor.monthly_energy_go'].state],
          })
  - entity: sensor.monthly_energy_standard
    name: monthly energy standard
    statistic: state
    period: month
    type: bar
    marker:
      color: "#EB57D2"
      opacity: 1
    texttemplate: "%{y:.2f}"
    textfont:
      size: 11
      color: "#000000"
    filters:
      - integrate:
          reset_every: 30d
          unit: m
      - resample: 30d
      - fn: |
          ({ys,xs,hass,}) => ({
            xs: [...xs, +xs.at(-1)+1000*60*60*24*7*4],
            ys: [...ys, hass.states['sensor.monthly_energy_standard'].state],
          })

[dbuezas]

Try with:

entity: ...
filters:
  - filter: i>0

The issue is that home assistant invents a data point at the beginning of the range, and plotlyjs makes the bars as thin as needed so the two closest ones don't overlap

[luissimoes]

Hi
Thanks!

yep that solves for the case of the daily energy where I have several points
For the case above, where I only have one month right now, it doesn’t …
i > 0 cuts the only point 😉

so I added instead the width with an fn

but yes, this is the general solution (the other was a fringe case)

thanks!!!