Lovelace: Power wheel card

Hi @vk2him , thanks for writing down your suggestions.

About number 1:
I like the fresh idea of coloring the arrows using the same colors the icons have. But since it’s a different approach as the current approach of coloring the arrows (i.e. using an active and an inactive color), it would mean I’d have to support both approaches. That’s adding to the complexity of the card. So I have to think about it a bit more. Maybe you could add your suggestion as a feature request here in GitHub and your suggestion won’t be lost in the big topic on the forum.

About number 2:
The coloring of the home icon you suggest is as copying the color of the grid icon to the home icon. That would break the current consistent approach of coloring the icons, since a green home icon would mean the home is generating power/energy/money. I try to understand your idea of attributing an overall earning/costing thing to the home icon. To me that overall earning/costing thing could be represented better by e.g. coloring the background of the whole wheel instead of just the home icon. But then again: the background color of the wheel will then resemble the color of the grid icon always. I’m not sure that will add anything. Ah well, you will be noticing it better from across the room.

About attributing more attention/value to the home icon. I agree. I’m thinking about a different layout where the home icon is in the center of the wheel. That leaves room for the battery icon in the outer ring. There is a growing collection of nice layout suggestions in this feature request on GitHub.

I saw this card on the Home Assistant Reddit and really liked the look, thanks for this!

I just implemented it, but it seems I’m doing something wrong:
image
The values under the icons remain 0 (and they flash when the card itself updates). What do I need to add to have values here too? The number under the arrow is correct with the current consumption.

Currently I am using 2 sensors in it:

grid_power_consumption_entity: sensor.huis_verbruik
grid_power_production_entity: sensor.vm_fase_power
solar_power_entity: sensor.vm_solar_power
title_energy: Energieverdeling
title_power: Energieverdeling
type: 'custom:power-wheel-card'

vm_solar_power = a Z-wave measurement device that measures the input of the solar panels (obviously 0 at this time of day)
vm_fase_power = a Z-wave measurement device that measures what we consume from the grid (when we produce more than we consume it goes to negative numbers)
sensor.huis_verbruik = a custom sensor that does a subtraction of the above 2.
I also have several DSMR values coming into HA but I haven’t checked those yet.

This is how I show it currently, that card is a lot nicer though and more clear.
image

Thanks @gurbyz - I’ve done as you suggest by updating github.

I love your idea of the background color following the earning/cost - perhaps that can be one optional view with the icons etc being black with values displayed? It would be a super simple basic “Am I selling or buying power” view.
Thanks
Ian

Hi Mathias,
Glad you like the card. You say you’re using 2 sensors, but actually you use 3 in your configuration. Please leave out the sensor.huis_verbruik because that one is calculated by the card also. And that’s the reason that you see some zeros.

Because you have a sensor.vm_fase_power that gives you a value for consuming as well as for producing, you can use grid_power_entity instead of the 2 input parameters you currently use for grid power. And because the polarity of the sensor is the inverse of what the card is expecting, you can use production_is_positive: false and you should be set.

grid_power_entity: sensor.vm_fase_power
solar_power_entity: sensor.vm_solar_power
production_is_positive: false

Thanks! That indeed fixed it.
image

1 Like

OK, I’ve almost fixed my issues. Switched custom component for my solar panel converter. Custom Component: Omnik Inverter Sensor

Still struggling with two sensors that do not refresh exactly at the same time (utility meter, exactly at 0:00:00, solar panels at 0:00:45) :frowning:

Really love this card @gurbyz, many thanks for creating it! Just FYI, here’s my layout:

The card is already really great, but should you be looking for features to add, here’s my wishlist:

  • Option to disable the power-view. As you can see in above screenshot, I have a power view next to daily and monthly energy views. For the daily and monthly views, I have added money views. But cycling through the power view is not necessary as that is already displayed next to it. So would be great if there’s an option to disable it
  • Support for ‘high’ and ‘low’ tariffs in money view, with automatic switching based on smart meter reporting ‘normal’ and ‘low’ tariffs
  • Support for chart footer
  • Option to hide the title

Keep up the good work!

Is there a way to size the icons (using css & card-mod), I have no issue sizing the text, coloring the icons, but don’t manage to resize the icons. Thanks!

I’m getting more and more confused the more I look at my configuration for energy calculation and I could use some advice. I’m using template sensors for my grid production and consumption this doesn’t work properly for me since it’s resulting in a net calculation, rather than cumulative for each. I’m starting to think I need a couple of data stores to effectively tally the each time the data is refreshed depending on whether I’m importing or exporting at that point in time, in which case it’s not going to be 100% accurate.

I note the enlighten web ui does provide exactly what I need but I’m not sure how to get hassio to access that data

Here’s my sensor setup in configuration.yaml

      exported_today:
        friendly_name: "Today's Energy Exported"
        value_template: "{{ [0, (states('sensor.envoy_today_s_energy_production') | int - states('sensor.envoy_today_s_energy_consumption') | int)] | max }}"
        unit_of_measurement: 'Wh'
        icon_template: 'mdi:flash'
      imported_today:
        friendly_name: "Today's Energy Imported"
        value_template: "{{ [0, (states('sensor.envoy_today_s_energy_consumption') | int - states('sensor.envoy_today_s_energy_production') | int)] | max }}"
        unit_of_measurement: 'Wh'
        icon_template: 'mdi:flash'

and here’s the relevant section in the card.

grid_energy_consumption_entity: sensor.imported_today
grid_energy_production_entity: sensor.exported_today
solar_energy_entity: sensor.envoy_today_s_energy_production

I have enlighten as well, however I obtain my consumption and production figures using a pulse counting Power meter connected to a device called a Flukso - https://www.flukso.net/about

The Flukso has in in-built mqqt broker, so it’s easy to just connect a sensor to its mqqt output. I have 3 x pulse counting power meters connected to the Flukso, 1) Solar Production, 2) House Power Consumption and 3) Hot Water heater consumption.

I am able to display however all the information from Enlighten - but there is a catch if you want the per panel details - you need the password for the installer account on your Envoy. If you have that password, this url has a ton of information (substitute the IP of your envoy: http://192.168.1.84/installer/setup/home#overview



To get your password, you need to download an Android app and enter the serial number of your envoy - it will then give you the password. If you don’t have an android phone, the app can be run on an Nvidia Shield or even an android emulator. This is the link to the (detailed) article ob how the guy wrote the app, look for the download link for the app just above where the comments start. https://thecomputerperson.wordpress.com/2016/08/28/reverse-engineering-the-enphase-installer-toolkit/

Here is the relevant sections from my configuration.yaml for obtaining the sensors for the envoy, flukso, and the value template for the power wheel. I have a value template for the solar production that farces a zero value after the sun sets as it will display incorrectly that it’s generating a few watts after sunset otherwise.

sensor 1:  
  - platform: enphase_envoy
    ip_address: your_envoy_ip_address_here
    username: installer
    password: your_password_here

sensor 2:
  - platform: mqtt    
    state_topic: "/sensor/your_consumption_sensor_id_here/gauge"
    name: "fluksoconsumption"
    qos: 0
    unit_of_measurement: "W"
    value_template: '{{ value_json[1] }}'
    
  - platform: mqtt    
    state_topic: "/sensor/your_Hot_water_consumption_sensor_id_here/gauge"
    name: "fluksoHWSconsumption
    qos: 0
    unit_of_measurement: "W"
    value_template: '{{ value_json[1] }}'    

  - platform: mqtt    
    state_topic: "/sensor/your_production_sensor_id_here/gauge"
    name: "fluksoproduction"
    qos: 0
    unit_of_measurement: "W"
    value_template: '{% if is_state("sun.sun", "below_horizon")%}0{%else%}{{ value_json[1] }}{%endif%}'
  
  - platform: template
    sensors:

      exporting:
        friendly_name: "Current Energy Exporting"
        value_template: "{{ [0, (states('sensor.fluksoproduction') | int - states('sensor.fluksoconsumption') | int)] | max }}"
        unit_of_measurement: 'W'
        icon_template: mdi:flash
      importing:
        friendly_name: "Current Energy Importing"
        value_template: "{{ [0, (states('sensor.fluksoconsumption') | int + states('sensor.fluksoHWSconsumption') | int - states('sensor.fluksoproduction') | int)] | max }}"
        unit_of_measurement: 'W'
        icon_template: mdi:flash
      solarpower:
        friendly_name: "Solar Power"
        value_template: "{{ states('sensor.fluksoproduction')}}"
        unit_of_measurement: 'W'
        icon_template: mdi:flash    
        

Hope that helps?

Further to this and looking at your original question - you need to access these enphase sensors - I’m not sure if you can get these without the installer password? You can use these instead of the Flukso sensors in my examples above by substituting sensor.fluksoproduction and sensor.fluksoconsumption with the following (except for the HWS so you can delete that from the sensor and value template)

          - sensor.envoy_current_energy_consumption
          - sensor.envoy_current_energy_production

EDIT - this isn’t going to give you real-time updates - These two envoy sensors are updated every 30 seconds, so might be useless for you? The Flukso is real-time with the mqqt data updating many times per second …

thanks, I have per panel access and also have access to the installer toolkit.

I’m using the current_energy_production and consumption sensors for my power distribution wheel, it’s just the energy distribution I can’t seem to get right. I do like your template to deal with the sun setting because it bothered me that the inverter consumption was still showing when they stopped producing.

I figured it out myself, in case anyone elese wonders, use this property as style: --mdc-icon-size

1 Like

@spudje - Do you mind sharing an example of how/where to set that property for icon size? Any idea how to change font size too? Thanks

Yes, sure, this is my power wheel configuration. Note that I also use card-mod, hui-element (and a bunch of others, required for this layout: A different take on designing a Lovelace UI ) But I honestly don’t exactly know what functionality comes with which custom component.

          - card_type: picture-elements
            type: custom:hui-element
            image: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' /%3E"
            style:
              top: 12%
              left: 85%
              width: 20.97%
              height: 1px
              font-size: 1vw
              "#root > hui-element > power-wheel-card":
                $: |
                  ha-card {
                    box-shadow: none;
                  }
                  #title {
                    font-size: 1.5vw !important;
                    padding-bottom: 0px !important;
                  }
                  .wheel {
                    padding-top: 1px !important;
                    padding-bottom: 2px !important;
                  }
                  .wheel > div {
                    padding-top: 2px !important;
                    padding-bottom: 2px !important;
                  }
                  #row {
                    height: 40px !important;
                  }
                  #toggle-button {
                    --mdc-icon-size: 1vw;
                  }
                  #cell-solar {
                    padding-left: 23% !important;
                  }
                  #icon-solar {
                    --mdc-icon-size: 2.6vw;
                  }
                  #icon-home {
                    --mdc-icon-size: 2.6vw;
                  }
                  #icon-grid {
                    --mdc-icon-size: 2.6vw;
                  }
                  #icon-solar2grid {
                    --mdc-icon-size: 2.6vw;
                    padding-right:10px;
                  }
                  #value-solar2grid {
                    padding-right:20px;
                  }
                  #icon-solar2home {
                    --mdc-icon-size: 2.6vw;
                    padding-left:10px;
                  }
                  #value-solar2home {
                    padding-left:20px;
                  }
                  #icon-grid2home {
                    --mdc-icon-size: 2.6vw;
                  }
                  #unit {
                    font-size: 1.3vw !important; 
                  }

Replace the lines such as

`           "#root > hui-element > power-wheel-card":
                $: |
                  ha-card`

with the DOM tree position of your power wheel card.

hi

I’m new around home assistant, I tried to integrate the power wheel, but it isn’t showing me the values like it should, I tried some workarounds described here but its not working, I have two shelly sensors one reading the solar production and the other reads what comes and goes to the grid.
when I integrated them on the power wheel the power wheel shows correctly the solar production, and what comes and goes to the grid on the arrow, but the grid shows 0 and the home shows the same numbers from the solar production, can anyone help me on this.

Thks

Hi, love this card! Been looking for something like this for a while so thank you!

Two questions relating to the Money view:

  1. Would it be possible to include a daily charge rate? I live in Australia and every day we get charged a flat rate ($0.94) for Grid power so it would be good to be able to include this rate into the card.

  2. More of a philisophical question, but should the amount of ‘money’ generated through solar power be subtracted from the amount of money generated through grid power to give you the total cost of power for the house? So in my example below, $0.80 would be subtracted from $1.08 to show the total cost of power being $0.28

Thanks!

1 Like

There wasn’t much philosophing going on when I implemented this view. :wink: It’s just the values of the Energy view multiplied by the rate. But the values will be hidden in future for users who have a different energy_consumption_rate vs energy_production_rate. See bug report.

For the feature request on the daily charge rate, could you post a feature request here on GitHub? Otherwise it gets lost in this topic.

It helps others helping you when you post also your configuration. But did you figure it out already?

Thx for you message.

  • Nr 1 is a nice feature request. Could you post it here on GitHub, so it won’t get lost?
  • Nr 2 is discussed here on GitHub.
  • Nr 3 is also a nice feature request. Could you elaborate a bit more on this (maybe an example) in a (separate, please) feature request on GitHub?
  • Nr 4 should be possible. Try omitting the title parameter in your config.