My energy dashboard for Amber Electric & EMHASS

[werdnum]

Wanted to show off the dashboard I pulled together for my energy management data, including integrations with Amber (Australian power company with dynamic pricing) and EMHASS (energy planning & forecasting)

Code

type: custom:plotly-graph
time_offset: 12h
config:
  plotlyServerURL: https://chart-studio.plotly.com
  showSendToCloud: true
  scrollZoom: false
entities:
  - entity: sensor.general_price
    attribute: per_kwh
    extend_to_present: true
    yaxis: 'y'
    name: Energy price history
    filters:
      - filter: state.attributes.estimate != true
      - filter: >-
          state.attributes.start_time !=
          hass.states["sensor.general_price"].attributes.start_time
      - fn: |-
          ({xs, ys, meta, states, statistics, hass, vars}) => {
            vars.last_history_entry = states[states.length-1];
            xs = states.map(state => new Date(state.attributes.start_time));
            last = vars.last_history_entry;
            return {
              xs: xs.concat([new Date(last.attributes.end_time)]),
              ys: ys.concat([last.attributes.per_kwh]),
            };
          }
      - filter: (i == xs.length - 1 || xs[i].getTime() != xs[i+1].getTime())
  - entity: sensor.general_price
    name: Current price
    yaxis: 'y'
    attribute: per_kwh
    line: |-
      $ex {
        return states[states.length-1].attributes.estimate ? {"dash": "dot"} : {};
      }
    filters:
      - filter: i == ys.length - 1
      - fn: |-
          ({xs, ys, meta, states, statistics, hass, vars}) => {
            const startTime = new Date(states[0].attributes['start_time']);
            const endTime = new Date(states[0].attributes['end_time']);
            vars.current_state = states[0];
            resp = {
              xs: [new Date(vars.last_history_entry.attributes.end_time), startTime, endTime],
              ys: [vars.last_history_entry.attributes.per_kwh, ys[0], ys[0]],
            };
            return resp;
          }
  - entity: sensor.general_price
    name: Current price marker
    texttemplate: '%{y:.2~f}'
    cliponaxis: false
    mode: text+markers
    showlegend: false
    hoverinfo: skip
    textposition: top middle
    textfont:
      color: red
      weight: bold
      size: 12
    filters:
      - filter: i == ys.length - 1
  - entity: sensor.electricity_price_forecast
    name: Forecast
    attribute: forecasts
    yaxis: 'y'
    line:
      dash: dot
    filters:
      - fn: |-
          ({xs, ys, meta, states, statistics, hass, vars}) => {
            const forecasts = states[states.length-1].attributes.forecasts;
            res = {
              xs: [new Date(vars.current_state.attributes.end_time)].concat(forecasts.map(fc => new Date(fc["start_time"]))),
              ys: [vars.current_state.attributes.per_kwh].concat(forecasts.map(fc => fc["per_kwh"])),
              meta: meta
            };
            return res;
          }
  - entity: sensor.powerpal_power
    name: Measured energy usage
    fill: tozeroy
    yaxis: y2
  - entity: sensor.emhass_wallbox_planned
    name: Wallbox planned
    attribute: deferrables_schedule
    fill: tozeroy
    yaxis: y3
    fillpattern:
      shape: x
      size: 5
    filters:
      - fn: |-
          ({xs, ys, meta, states, statistics, hass, vars}) => {
            const forecasts = states[states.length-1].attributes.deferrables_schedule;
            res = {
              xs: forecasts.map(fc => fc["date"]),
              ys: forecasts.map(fc => fc["emhass_wallbox_planned"]),
              meta: meta
            };
            return res;
          }
  - entity: sensor.wallbox_charging_power
    yaxis: y3
    name: Wallbox History
    fill: tozeroy
    filters:
      - map_y: 1000 * y
  - entity: sensor.emhass_ac_planned
    name: AC planned
    attribute: deferrables_schedule
    fill: tozeroy
    yaxis: y4
    fillpattern:
      shape: x
      size: 5
    filters:
      - fn: |-
          ({xs, ys, meta, states, statistics, hass, vars}) => {
            const forecasts = states[states.length-1].attributes.deferrables_schedule;
            res = {
              xs: forecasts.map(fc => fc["date"]),
              ys: forecasts.map(fc => fc["emhass_ac_planned"]),
              meta: meta
            };
            return res;
          }
  - entity: climate.ac_0
    yaxis: y4
    name: AC State
    attribute: deferrables_schedule
    fill: tozeroy
    fillpattern:
      shape: x
      size: 5
    filters:
      - fn: ({xs, ys, states}) => { console.dir({xs, ys, states}); }
      - map_y: 'states[i].state == ''off'' ? 0 : 1'
      - fn: ({xs, ys}) => { console.dir({xs, ys}); }
  - entity: sensor.emhass_pool_pump_planned
    yaxis: y5
    name: Pool pump plan
    attribute: deferrables_schedule
    fill: tozeroy
    fillpattern:
      shape: x
      size: 5
    filters:
      - fn: |-
          ({xs, ys, meta, states, statistics, hass, vars}) => {
            const forecasts = states[states.length-1].attributes.deferrables_schedule;
            res = {
              xs: forecasts.map(fc => fc["date"]),
              ys: forecasts.map(fc => fc["emhass_pool_pump_planned"]),
              meta: meta
            };
            return res;
          }
  - entity: sensor.pool_box_outlet_power_left
    name: Actual usage
    fill: tozeroy
    yaxis: y5
  - entity: sensor.emhass_pool_pump_planned
    name: Prior plan
    line:
      dash: dot
    yaxis: y5
defaults:
  entity:
    showlegend: false
  yaxes:
    side: left
    visible: true
    showgrid: true
    overlaying: false
layout:
  dragmode: pan
  height: 900
  xaxis:
    showspikes: true
    spikemode: across
    spikethickness: 1
    nticks: 18
    minor:
      tickvals: $ex [new Date()]
    rangeselector:
      'y': 1.01
      buttons:
        - count: 30
          step: minute
        - count: 1
          step: hour
        - count: 3
          step: hour
        - count: 6
          step: hour
        - count: 12
          step: hour
        - count: 24
          step: hour
  yaxis:
    overlaying: 'y'
    nticks: 10
    autorange: true
    autorangeoptions:
      include: -2
  yaxis2:
    overlaying: y2
  yaxis3:
    overlaying: y2
  grid:
    pattern: coupled
    roworder: top to bottom
    ygap: 0.3
    rows: 5
    columns: 1
  annotations:
    - text: Total Energy Usage
      showarrow: false
      x: 0.5
      xref: paper
      'y': 1.2
      yref: y2 domain
      font:
        size: 14
    - text: Wallbox EV Charger
      showarrow: false
      x: 0.5
      xref: paper
      'y': 1.2
      yref: y3 domain
      font:
        size: 14
    - text: AC
      showarrow: false
      x: 0.5
      xref: paper
      'y': 1.2
      yref: y4 domain
      font:
        size: 14
    - text: Pool Pump
      showarrow: false
      x: 0.5
      xref: paper
      'y': 1.2
      yref: y5 domain
      font:
        size: 14
  shapes:
    - type: line
      label:
        text: Now
      x0: $ex new Date()
      y0: 0
      x1: $ex new Date()
      y1: 1
      yref: paper
      opacity: 0.5
      line:
        color: blue
        dash: dot
        width: 1
hours_to_show: 18
refresh_interval: 10
title: Amber Electricity Price

Notes

• I found a nicer way to do the "line for now" that crosses all the charts using a shape.
• Multiple subplots, multiple traces per subplot, and you can do multiple y axes per subplot with a shared x-axis (using overlaying).
• This took a ton of trial and error.

[BenJewell]

How did you get the graph to show price instead of KwH? I tried multiplying it by the electricity rate using "states" like this, to get cost, but it doesn't work:

filters:
  - multiply: states('input_number.electricity_price')