jonahkr / power-distribution-card Goto Github PK
View Code? Open in Web Editor NEWA Lovelace Card for visualizing power distributions.
License: MIT License
A Lovelace Card for visualizing power distributions.
License: MIT License
I have implemented it like this in Manual Card:
type: 'custom:power-distribution-card'
title: Overview
battery: none
home: sensor.energy_consumption
solar: sensor.fronius_pac
grid: sensor.kamstrup_activepowerplus
autarky: sensor.autarky ???
ratio: sensor.ratio ???
I do not have a battery, but the other sensors are correct and showing data in my other cards.
Do this card need specific sensors, or what am I doing wrong
I have multiple inputs ans want to calculate the effective output to grid.
How can I get access to the calculation ?
Thanks
Wolfgang
Hi,
your card is perfect from functionality point of view, but the arrow animation (jumping arrows) is not really nice (my opinion).
I could successfully modify your card to suggest an improvement, you can see it in the video (in attached zip).
I can't offer you a pull request, because I have no idea how to build your project. So I modified just the resulting .js-file. But I attached the js-file I modified, so you can see in a diff the few changes I made. Probably you like it and can inlude it in your card.
Regards, Waldemar
Add the option to click on the diffrent items and react by opening a history window as in the standard Homeassistant entity card.
Thanks for providing this very nice looking power distribution card. I am currently integrating data from the EON Energiemonitor in order to visualize the regional energy generation/demand using your card. However I found a small bug:
('kW' || 'kWh')
is always 'kW'
.
I would suggest to check for unit_of_measurement.startsWith('k')
in order to be generic for all kinds of units. This might be extended with 'M' and 'G' later on.
Hi,
found your custom card for lovelace and it's working for a while now. Awesome!! I really like it.
Now I have an idea: wouldn't it be possible to enrich those three marked section with the related battery levels? I already have those sensors available within my home assitant instance and it's just a question of "how" to get them into your custom card.
Thanks in advance
Frank
First I have to say i LOVE your card π .
It is not really an issue, more like an idea.
I want to use it for showing individual devices, like: house heating, fridge, computer and so on.
But i don't have any devices that produce energie (solar or wind) so i'm not so much interested in the ratio and autarky bars. Is it possible to make it optional to hide?
In the mobile view, The hardcoded sized of the grid lead to a Corrupted rendering of the card.
This can be fixed by using variable sizing of elements.
Hi @JonahKr . First off, thank you for making an awesome card. I love it!
I recently installed v1.6 and tried out the adaptive W/kW detection.
It seems that it is not working right with my Smart Meter:
This should be showing either 249W or 0.249kW.
Any chance you can have a look?
In addition, the arrows no longer line up with the item they are displaying. They seem too low now.
Last point: The new slide option for the arrows is super slick. I love it! However, when I enable it and look at the Android app, they are still flashing, not sliding.
Hi,
first of all, thanks for this very nice card!
If I open it on my desktop, everything works fine. But if I open it with the iOS App, it only shows the menu bar without entries and after some time it loads the main view again. If I open the url in Safari on the phone, it is the same behaviour and the browser crashes after some time. Any advice?
My configuration is:
type: 'custom:power-distribution-card'
title: E3DC S10 pro
entities:
- decimals: '2'
display_abs: true
name: solar
unit_of_display: W
icon: 'mdi:white-balance-sunny'
producer: true
entity: sensor.e3dc_solar_power
preset: solar
icon_color:
bigger: ''
equal: ''
smaller: ''
- decimals: 2
display_abs: true
name: grid
unit_of_display: W
icon: 'mdi:transmission-tower'
entity: sensor.e3dc_grid_power
preset: grid
- decimals: '2'
display_abs: true
name: battery
unit_of_display: W
consumer: true
icon: 'mdi:battery-outline'
producer: true
entity: sensor.e3dc_battery_power
preset: battery
icon_color:
bigger: red
equal: ''
smaller: green
invert_value: true
- decimals: '2'
display_abs: true
name: home
unit_of_display: W
consumer: true
icon: 'mdi:home'
entity: sensor.e3dc_power_consumption
preset: home
icon_color:
bigger: ''
equal: ''
smaller: ''
invert_value: true
center:
type: card
content:
type: glance
entities:
- entity: sun.sun
name: Sonne
state_color: true
animation: none
Nice feature with the extra bars.
Actually I would love to be able to have 3 bars between the indicators and icons, in stead of two.
This will demand the bar width and distance between the two bares to be less.
In that case I could have these bars,
To Grid
Own production
total taken from grid
Regards,
@pesor
Invert arrow is not working. No matter how i set it up ( true or false ) it always show current going out of my battery.
How about adding a few more sonsor values to the display? Like a 5th or 6th small icon with consumption or production values?
Hi,
First, Great Job, nice Card.
Question:
I have a sensor and this indicates interface to the power supplier.
When de consumed power is lower then the produced power it wil give a negatief value, eq: 400 W or -400 W
Is it posible to use this messurements in the power-distribution-card?
Something like this:
solar: 4000 W
home: 1000 W
grid: -3000 W
Greetings,
Martin
Hi,
I like your card a lot. It would be great, if you could add a state of charge display for the battery (in percent).
Thanks, Waldemar
I have created the card as per below, But not sure if i am missing something.
type: 'custom:power-distribution-card'
title: Overview
battery: sensor.battery_watts
home: sensor.inverter_totalwatts
solar: sensor.solar_watts
grid: sensor.gridwatts
autarky: sensor.autarky -- This i did not change do i need to do something here?
ratio: sensor.ratio -- This i did not change do i need to do something here?
Not sure if this works with Any Solar system or just with e3DC?
I have just updated from version 1.7 to 2.2. Following I removed the power distribution card in my lovelace setup and created a new one using the UI on the webbrowser of my computer.
Using the Android Home Assistant Companion App however I have found out, that this card is not displayed. It seems that also the option to create the power distribution card is not available on the Android App. Can you imagine a reason for this?
In case you require any further information to analyse this problem, let me know and I am glad to share.
By Vectorizing the Gif Animations some computing rescources can be saved by integrating just the bare paths.
Either as single triangles with color manipulation as animation or 3 sets of coloured paths.
@JonahKr I managed to get your fantastic card to work exactly as I wanted it to.
Impressing card indeed, it now matches how my energy is created and used and stored on the grid.
I explain the Icons, for better understanding of my request.
Solar is what is currently produced by my solar cells
Grid is what is currently sendt to grid, (green) or collected from grid (red)
From/Solar is what is directly outside grid, currently used of the produced energy from my solar cells
(Fase 3) as my Solar cells are only 2 fases, the 3rd fase always draw power from the grid, no matter what is produced from solar cells.
Home is the total energy consumption currently taking place.
Now to the isssue:
Grid/Bank, is what I have stored on the grid, green in my favor, red in the energy company's favor.
As you can see the measurement is kWh, and this field is not included in any calculations, as it is a pure figure, that constantly updates, according to production/energy usage, to from the grid.
This is a special Danish solution, where if your sun cells were ordered before november 2012, you could use the grid for storage of the production you currently not use, and draw from this when the sun is down. (This solution does not exist anymore), but in my case is valid for another 12 years.)
Now to the request:
I would really like a feature to turn the arrows off, when not including the Icon data in the calculations. Meaning that it only will contain the figures, and not the triangles.
So it looks like this:
This is actually not an issue, but an example for how I have used your card:
I changed the green column to show how much of production goes to grid, and blue, shoe how much of my production goes to own energy consumption.
(actually a nice feature would be to have an third column showing how much of the total consumption comes from the grid)
This is the coding in the power-distribution-card:
type: 'custom:power-distribution-card'
title: Overview
entities:
- solar: sensor.fronius_pac
- grid: sensor.fronius_energy_grid
- home:
entity: sensor.energy_consumption
invert_value: true
- autarky:
bar_color: blue
name: Eget
- ratio:
entity: sensor.fronius_w_to_grid
bar_color: green
name: t/Grid
and this is the coding in the configuration.yaml, where I have made som work variables:
#START Fronius and Kamstrup variables
- platform: template
sensors:
energy_consumption:
value_template: >
{{'%0.0f' | format(states('sensor.fronius_pac') | float -
states('sensor.kamstrup_activepowerminus') | float +
states('sensor.kamstrup_activepowerplus') | float) }}
unit_of_measurement: 'W'
- platform: template
sensors:
fronius_energy_consumption:
value_template: >
{% if states('sensor.energy_consumption')|float < 0 %} 0
{% endif %}
unit_of_measurement: 'W'
- platform: template
sensors:
fronius_energy_grid:
value_template: >
{{'%0.0f' | format(states('sensor.energy_consumption') | float - states('sensor.fronius_pac') | float) }}
unit_of_measurement: 'W'
- platform: template
sensors:
fronius_w_to_grid:
value_template: >
{% set grid = states('sensor.fronius_energy_grid') %}
{% set prod = states('sensor.fronius_pac') %}
{% set result = grid |float / prod |float *-1 %}
{% if result |float < 0.00 %} 0
{% elif result |float > 0.00 %}
{{ '% 0.0f' | format(states('sensor.fronius_energy_grid') | float / states('sensor.fronius_pac') | float *-100) }}
{% else %} 0
{% endif %}
Thanks for a very good card.
Is there a possibility to get the autarky and ratio values into graphs?
Hi,
thanks for you card. I really like it!
Is it possible to save the 'autarky' & 'ratio' values in a sensor? I want to put them in my influxdb.
Thanks!
I like the idea of this card - can you consider a change so that the colours of the entities change depending on whether they are producing or consuming power?
For example, the house will always be Red as it is always consuming power, however if power is being exported then it should be green and red if it is importing. This way it is easy to tell at a glance if excess power is available.
Autarky could also have a range of colours - 0-30% = Red 30-50% - Orange - 50-70 % light green - 70-100% dark green
Thanks
Thanks a lot for this great lovelace card.
If I'm reading the code correctly the words ratio and autarky is currently hardwritten:
Could you add a possibilty to change this via name attribute?
// works
home:
entity: sensor.e3dc_house_power
invert_arrow: true
name: Haus
// don't work
autarky:
entity: sensor.e3dc_autarki
name: Autarkie
Hello! I really enjoy the power distribution card and use it with an E3DC-System.
Now I tried to configure two gauge-cards as a vertical stack in the middle, this basically works, but the cards get redrawn like every other second. This looks somehow weird...
My code:
- type: 'custom:power-distribution-card'
title: ''
entities:
- decimals: 2
display_abs: true
name: solar
unit_of_display: W
icon: 'mdi:solar-power'
producer: true
entity: sensor.e3dc_pv_leistung
preset: solar
- decimals: 2
display_abs: true
name: grid
unit_of_display: W
icon: 'mdi:transmission-tower'
entity: sensor.e3dc_netzleistung
preset: grid
- decimals: 2
display_abs: true
name: battery
unit_of_display: W
consumer: true
icon: 'mdi:battery-outline'
producer: true
entity: sensor.e3dc_batterieleistung
preset: battery
- decimals: 2
display_abs: true
name: home
unit_of_display: W
consumer: true
icon: 'mdi:home-assistant'
entity: sensor.e3dc_hausleistung
preset: home
center:
type: card
content:
type: vertical-stack
cards:
- type: gauge
entity: sensor.e3dc_batterieladung
min: 0
max: 100
name: Speicher
severity:
green: 20
yellow: 10
red: 0
- type: gauge
entity: sensor.e3dc_autarkie
min: 0
max: 100
name: Autarkie
severity:
green: 85
yellow: 50
red: 0
animation: slide
Is this caused by my configuration?
Implement a way to change the rounding of the values or set the entity values to kW instead of W. The use case is the Tesla Powerwall.
I really love this card. Thanks so much for creating it!
I expect that I am trying to use the card for a display beyond what it was designed for, but I have notices that when I add more than 3 consumers, the layout of the card gets a bit mixed up...
As you can see, I basically group my energy sensors by type or function, and I'd love to use the card to show a live breakdown of energy usage in my house.
Thanks again!
Adding language support for all text fields (e.g. Solar, Grid, Autarkie etc... ). The language setting could be pulled from the Home Assistant instance.
External Translation services should not be required because there are no sentences included.
To enable a better user experience, a visual editor would be helpfull.
However this maybe would require additional and more extensive translations. (#2)
Suggestion.... Could we show our own Unit of Measure
i am used to work with Amp
Amp produce by the Solar Panel
Amp produce by the car alternator
Amp consume by the Motorhome
tks
How to avoid the error divide by zero?
2020-12-14 19:11:28 ERROR (MainThread) [homeassistant.helpers.event] Error while processing template: Template("{% set grid = states('sensor.enphaseenvoy_energy_grid') %} {% set prod = states('sensor.enphaseenvoy_current_energy_production') %} {% set result = grid |float / prod |float *-1 %} {% if result |float < 0.00 %} 0 {% elif result |float > 0.00 %} {{ '% 0.0f' | format(states('sensor.enphaseenvoy_energy_grid') | float / states('sensor.enphaseenvoy_current_energy_production') | float *-100) }} {% else %} 0 {% endif %}")
2020-12-14 19:11:28 ERROR (MainThread) [homeassistant.components.template.template_entity] TemplateError('ZeroDivisionError: float division by zero') while processing template 'Template("{% set grid = states('sensor.enphaseenvoy_energy_grid') %} {% set prod = states('sensor.enphaseenvoy_current_energy_production') %} {% set result = grid |float / prod |float *-1 %} {% if result |float < 0.00 %} 0 {% elif result |float > 0.00 %} {{ '% 0.0f' | format(states('sensor.enphaseenvoy_energy_grid') | float / states('sensor.enphaseenvoy_current_energy_production') | float *-100) }} {% else %} 0 {% endif %}")' for attribute '_state' in entity 'sensor.enphaseenvoy_w_to_grid'
When autarky is being automatically calculated, sometimes it displays a figure that isn't a whole number and it displays many zeros with a value, ie, 51.00000000007%
The percent should be fixed to a whole number to avoid this issue - thanks
Hey there π
I am very sorry that updating this card disabled your configured settings.
Adding the Visual Editor required some serious changes to how configuration is handled and therefore quite a few breaking changes had to be introduced.
This will be the Last time though. I hope
If you still have issues getting everything back working feel free to post it in this thread and i will help you as fast as possible.
Hi, in my setup i have 2 different sensors that define the grid:
how would i use this card with the 2 sensors?
Hello,
interesting integration!
What exactly does ratio mean?
Thank you
Greetings
Steff
Good Day Again,
Would be great if you could build in the battery SOC sensor that then changes the icon the more depleted it becomes where you can specify the % you would like it to be red/orange/green.
Example
battery:
entity: sensor.e3dc_battery
soc: sensor.battery_soc
color:
green: 80
orange: 50
red: 30
Would also be great if you can show the % under the battery image on the card :)
Might be wishful thinking.
Hello Jonah,
this is a very cool card.
I have two more questions:
Is it possible to execute an action, service, ... with tab_action or hold_action?
Is it possible to include a placeholder? For example, there should be producers on the left, two in my case, and consumers on the right, six in my case.
Greetings Stephan
I have been trying to understand the percentage for the ratio, and the autarky.
When the solar system produces more electricity than is used, and the overflow is sent to the Grid, the two percentages make sense, as the ratio is 100% and the autarky states the percentage sent to Home.
OK, now the solar system is producing less than is used, and the Overview looks like this:
Here I can simply not figure out what the percentages are saying...
I would be happy if you could clarify.
Hi there!
I've just begun using this card and it works great, but I noticed it does not handle sensors that are Unavailable properly.
This occurs when say one of my smart plugs with energy monitoring is unplugged.
Instead of showing "Unavailable" or something to that effect, it shows "NaN W" and an animated arrow despite essentially being 0 consumption.
Attached is an image of this behaviour.
It seems like changing this line of code to check for NaN should fix the arrow animation, but I leave that up to you! Especially in terms of how to handle the wattage display.
Thank you for this card!
Dylan
I saw that in my German installation, autarky and ratio are always English.
I didn't find this in language JSON files. Maybe this can be added?
AND, big thanks fΓΌr this nice project :-)
It is working perfect: π
Your card is PERFECT, and I would like to buy you a bear, but you do not have that possibility on your repo.
There is a little glitch in the Visual Editor though.
You set "absolut" value as default, but if you change it, you have to change it back and forth 3 times before you can save it.
If you do nothing, the "absolut" value is not changed, if you in a previously save has unmarked it.
Decimals points, do not work when setting the unit of Display, as you will see the value is 0,63, and not 631, it correct it self when save, but figure is shown without decimals.
As said minor flaws, and not important for the card usage.
Hello, great card! I have tested various cards, but I will definitely go for this card.
I'm not yet sure how to setup the center . In general I like the bars, but I have some comments:
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.