reptilex / tesla-style-solar-power-card Goto Github PK

Unless a battery is defined, car2 does not show properly

PS: I've been opening PR, but this point I really need help ;)

Hey guys!

I’m more than happy about this great card! Perfect!

But I still have one more idea:
Is it possible to configure the icons in a way, that e.g. the house is displayed in green if it is only supplied by solar power, in yellow if it is powered by solar power and power from the grid and in red, if only power from the grid is used?

I tried to chande the *.js file in different ways, but I didn’t become it working…
And I am no specialist in programming cards…

Maybe someone can help me?

Maybe it is also possbile to make the colors configurable via tha yaml-data for the card?

Thanks,
Julian

How many dots should be visible?

First, I just wanted to say great job with this being your 1st contribution to HA. I've been waiting for someone to do this card, kudos!

Okay, onto my problem... It is not clear which sensor goes to what attribute of your card. I've tried several different combinations, but I'm still not able to get what I see in your demos.

Tesla Powerwall Integration

Let's start with what I have for entities. Here is a screenshot of my integration and entity names, next to the actual live values so you can understand what they represent.

Card Configuration

At this point, let's clarify what the entities represent. Here is my understanding of the ones we can use for your card::

• sensor.powerwall_load_now - The energy the house is currently using (in only)
• sensor.powerwall_site_now - The energy coming from the Grid (positive value is consumption, negative value is selling)
• sensor.powerwall_solar_now - The energy coming from my solar panels (out only)
• sensor.powerwall_battery_now - The energy the battery is using/providing (in and out)
• sensor.powerwall_charge - The battery level in %

Although I don't see a setting for it now, you could add support for:

• binary_sensor.powerwall_charging - string boolean representation "Charging" and Discharging"

How do I setup the card with those entities?

I'm confused about the difference between the different solar attributes (yield vs consumption?) and grid settings (consumption vs feed in?)

type: 'custom:tesla-style-solar-power-card'
house_consumption_entity: sensor.powerwall_load_now
grid_consumption_entity: ??
grid_feed_in_entity: sensor.powerwall_site_now
solar_consumption_entity: ??
solar_yield_entity: sensor.powerwall_solar_now
battery_charging_entity: sensor.powerwall_battery_now
battery_consumption_entity: sensor.powerwall_battery_now

Note: I do see the comments in the 2nd, larger example. The confusing part is the relationship between the consumption items and the "in" items. Do I use only the consumptions ones form the powerwall integration?

Custom Sensors

This leads me to my last thought, how am I supposed to get separate values for "power from" and "power to" options when I only have 1 value as a positive or negative number.

The Powerwall entities don't care about in or out, they show either a negative value or a positive value for those 4 items.

Is there an example that shows how to combine the Powerwall entities values to create those virtual sensors that will work with your card?

Current Setup

So that you can see where I am at right now, here is my setup:

type: 'custom:tesla-style-solar-power-card'
house_consumption_entity: sensor.powerwall_load_now
solar_yield_entity: sensor.powerwall_solar_now
battery_charge_entity: sensor.powerwall_charge
battery_charging_entity: sensor.powerwall_battery_now
battery_consumption_entity: sensor.powerwall_battery_now
grid_consumption_entity: sensor.powerwall_site_now

Here's the result in Lovelace.

Problems:

• No connection from the battery to the Grid
• I do not have any animations

I'm pretty sure both of those problems are because of the missing "To/From" values. So again, I'm guessing this is going to rely on custom sensors to calculate the values.

It would be great if one could set a title in the card config to show a title. Is that possible?
So if I have two such cards and two solar systems, I could name both.

Hi, I'm testing the code that you published in readme.md

Placed "as is" in my configuration with a powerwall 2 it seems to work correctly for house, solar and grid, but for some unknown reason the battery is not displaying. (screenshot taken by night, running on batteries!)

I'll read more about the documentation and try to find a way to make it work ;)

BTW, I'm running HassOS on virtual machine, version 2021.3.4 :)

This card keeps getting better and better, compliments for that!

I noticed the EV line from house not aligning perfectly yet. Could you fix this? or point at the line in the code where this is managed; I could trial-and-error the best alignment.

Great work on this card.
Are you going to add a graphical config to this card?

Is it possible to change the battery icon based on battery percentage? Very minor feature of course but would make a nice visual guide when glancing at it. Same maybe to change car color based on charge level or something like it (eg green when above 80 or red when below 20).

Hi,

my shown values do not update :(.

Graphics work now, but the values don't change.

Is there a timer variable that is used?
The values changed ONCE today....

THX
Markus

First of all thanks for this wonderfull cards...
There is a small issue for Applicance 1. Despite "show_w_not_kw: 1", unit is still in kW however Grid, Generation and House are correctly displayed in W.
Thanks again for th work.
Best

Tesla has an option called ConnectedSolutions for Powerwalls. When enabled you sell energy to the grid from your Powerwall during peak hours. Currently the card has no way to represent this movement of energy though, the only options for the battery are these:

grid_to_battery_entity: sensor.grid_to_battery //expects (k)W for the power being fed from the grid to the battery (buying low cost grid price power)
battery_charge_entity: sensor.battery_charge //expects % of charge of battery
battery_charging_entity: sensor.battery_charging //expects (k)W for the power being fed from the solar panels to the battery
battery_consumption_entity: sensor.battery_consumption //expects (k)W for the power being consumed by the house from the battery

There would need to be a battery_to_grid_entity option for this so the card could then show energy moving from the battery to the grid when that entity is positive.

I noticed, that either the lines or the entity-icons are placed incorrect .
Lines overlap or there is space between them and the entity-icon.

Card Version 9.2.2
HA Version 2021.3.4
I am using the default theme.

Hi, Loving the card. Got it working very well, thank you.

I don't yet have an EV. But I do have an Eddi immersion boost. Would it be possible to swap the 'CAR' icon for say, a shower head or something similar to visualise my immersion heating?

Thanks,
Matt

Hi,

Located my .js and changed the mdi icons but even after restarts they remain as a car.

Also when I auto install on hassio not docker install the card never appears in the +Card option.

Latest versoions of super visor and all.

Just wanted to customise for my install but other than that it works really well....

Location of the .js on my install
/config/www/community/tesla-style-solar-power-card/tesla-style-solar-power-card.js

`
if(config.car_charging_entity != undefined){
this.carCharge = new sensorCardData();
this.carCharge.entity = config.car_charging_entity;
this.carBatteryState = new sensorCardData();
this.carBatteryState.entity = config.car_battery_entity;
this.carIcon = 'mdi:fish';
}

if(config.car2_charging_entity != undefined){
  this.car2Charge = new sensorCardData();
  this.car2Charge.entity = config.car2_charging_entity;
  this.car2BatteryState = new sensorCardData();
  this.car2BatteryState.entity = config.car2_battery_entity;
  this.car2Icon = 'mdi:**computer-classic**';
}

`

i was trying to use the car consumption but not for a car, for a solar water heater, it has a resistance that can be turned on and when it on it has a consumption. when I integrated it with this card it shows a little bit weird I think because the card is not prepared to show only the consumption everything misaligned, please make it possible to have or not the % to everything be aligned perfectly

Enhancement request/Suggestion:

Make Entities clickable. If you click on Solar/Grid/Load/Battery etc. it shows the entity detail graph.

This is in line with most Lovelace card entities.

Hi,

In my setup, I have.....

Grid
Solar
Battery
Car1
Car2

But The battery can charge from the grid or from solar.
Solar could go to the battery, to the car, to the grid.

It's too complex to work out what is going where.

The only way I could do it really would be to just have a star with a central hub.
Each device (battery, solar, house, car etc.) is a spoke on the wheel and gives or receives power.

This is how myEnergi show it in their app and it makes sense.
For me to calculate sensors for solar to house, solar to grid, solar to battery would be too complex.

It's a shame, as I like the presentation of your card, but I can't make it work in my setup.

Thanks anyway.

I have a node-red renewable simulator that also has wind. Any change you could add wind as a source?

Kudos for starting a new project and sharing. Thanks!

The problem lies in having the icons outside of the svg. I was too lazy to port them also into it, besides I did not really get how to do that with the mdi font. It might be a quick fix, but I will leave the out of place lines there for now. Hope to get to that soon.

This card is exactly what I was looking for.
But is there any chance it could support 2 cars ?

Thanks

Hey I was wondering whether you could make the grid part optional, since I have an off-grid system it does not make much sense for me to have the grid part showing?

Is it possible to change the setting: show_w_not_kw to an option to show default Watt values and show kiloWatt above an configured threshold?

Firstly I think this card is going to be excellent. Pulling together data from various different systems is exactly what I need - Myenergi, SolarEdge, Tesla apps all missing something.

On installing, however I cant get the layout to be correct. the lines are not in the right place. May well be user error - very new at this. my layout is below - explains the situation best. Data is all correct

It would be nice if there was a documented sample setup for the entities created by the Tesla integration. Those are:

powerwall_battery_now -- kW; negative if powerwall is charging, positive is powerwall is discharging 
powerwall_site_now -- kW; grid access. negative if feeding back to the grid, positive if incoming
powerwall_solar_now -- kW; solar power production
powerwall_load_now -- kW; current home load

Also a couple of binary values like grid_status.

I don't actually know if it's possible to deduce all the different paths just from this data. I'll dig in to some of the additional data on each entity's value. There are some constraints that would help; for example, if solar is installed, powerwall will only charge from solar (except during storm watch events). But e.g. solar production could be going to house, powerwall, and grid, with the powerwall incoming charge varying based on the powerwall's needs. I can attempt to work out the right expressions to calculate exactly how much is going to each, but if someone has already done it it would be helpful to have in the readme :)

A small suggestion -- would be nice if the config names followed a pattern to make them easier to reason about in complex expressions. e.g. currently config wants the first column names; the second might be easier to think about (for me):

might make it a little easier to see what's going where.

I have an optional feature request:

To make the display smoother, it would be nice to show the energy flow not by the flowing bubbles but by the thickness of the lines. 1 pixel = 1 kW.
Display Options selectable: Bubbles or thickness.

Also the CPU consumption would be probably smaller thereby.

Like this:

As @msim888 reported, when you have power from grid, the power lines for charging battery are also being shown and have a moving circle. So I'm trying to get to the bottom of this

Is it possible that you hide the lines as soon as there is no more transfer on this path?

Hi reptilex,

First of all, aweseme card! It looks great. Just got a problem with how it's drawn when in a stack (vertical, horizontal or grid). It seems to compact the drawing space of the card resulting in a bad placement of the cards element.

See screenshot attached.

The above is a plain manual card, below a manual card in a vertical stack.

Maybe related: when adding the vertical stack card in the screenshot, the normal card becomes a very small blank card. When I edit that top card and remove the trailing blank line in the code editor, it reverts back the normal drawing... Very peculiar.

Thanks in advance for the help!

Cheers

On the previous version, I only had flow from Grid to House, not from solar power to House; on this version no flow whatsoever. What can it be?
Values showned are correct.

First of all thank you for taking the time to address all the issues that come up.

I have v1.1.6 installed and this is my config:

type: 'custom:tesla-style-solar-power-card'
hide_inactive_lines: 1
show_w_not_kw: 1

## Bubbles
grid_consumption_entity: sensor.sdm230power 
         ## this can be + or -.  (Can use sensor.import_power but it makes no difference)
house_consumption_entity: sensor.house_power
generation_yield_entity: sensor.sdm120power

## Flows
grid_to_house_entity: sensor.import_power
generation_to_grid_entity: sensor.export_power
generation_to_house_entity: sensor.solar_use

The bubbles are not responding to clicks. Tried browsers and HA app an iPhone and iMac. The only reaction to a click on a bubble is a blue rectangle around the card:

Also the Grid bubble displays a '-' when solar is exporting to the grid. Is this intentional. Not complaining, just to know.

Cards can show up in the card picker using this syntax:

window.customCards = window.customCards || [];
window.customCards.push({
  type: "content-card-example",
  name: "Content Card",
  preview: false, // Optional - defaults to false
  description: "A custom card made by me!" // Optional
});

It'd be nice if this card supported that.

Hi,

i tried to use your card in IOBrokers Lovelace implementation.
Usually all cards just work fine there (apex-charts or dual-gauge for example).

However your card shows only as follows:

Colors are missing, lines are missing, but at least bubbles are travelling.

My config:

type: 'custom:tesla-style-solar-power-card'
name: Solaranlage
grid_to_house_entity: sensor.SE_Meter_Netzbezug_berechnet_momentan
generation_to_grid_entity: sensor.SE_Meter_Einspeisung
generation_to_battery_entity: sensor.SE_Batterie_Leistung
generation_to_house_entity: sensor.SE_AC_Leistung_skaliert

Any ideas how to debug this?
(i even tried the latest version here: https://github.com/reptilex/tesla-style-solar-power-card/tree/energy_flow_diagramm)

Greetings and thx in advance,
Markus

Should be possible to have W or kW depending if the value is > ou < then 1000W

Currently W are converted to kW, which is a shame for us with less then 1000W solar panels installed

Can you please guide how to calibrate the speed of the balls that move? I have quite high usage so would like to change the upper bounds for example of what represents "fast" or "slow" moving?

Can you provide a valid YAML lovelace card? The example is not working. Something like:
- entities: - grid_consumption_entity: sensor.dsmr_reading_electricity_currently_delivered - grid_feed_in_entity: sensor.grid_feed_in - house_consumption_entity: sensor.house_consumption - solar_consumption_entity: sensor.solar_consumption - solar_yield_entity: sensor.solar_yield type: 'custom:tesla-style-solar-power-card'

I'm only displaying Car, Grid House and Solar.

When "Battery" isn't present, the Car floats up over the house.

Solar/Grid/Battery/House all show W (or kW), but appliances seem to just show the raw number.

(Sidenote, so far your powerwall sensors seem accurate, though as you can see a filter on the solar production might be needed to ignore what I assume is inverter drain. I'll know tomorrow when the sun comes up if everything is wired correctly.)

I love this card, however to me it makes sense to show loads in watts if it is less the 1 killowatt. However when using threshold_in_k, I have found two issues:

1. The dot gets stuck at the grid icon (see picture below) if set at 2 or more (e.g. threshold_in_k: 2)
2. Setting threshold_in_k: 1 still shows kW rather than W for loads < 1 kW (i.e. it should show 0-999 W, then 1 kW)

This card is simply amazing.

Unfortunately, since the last update it doesn't work on Safari or on the iOS app anymore.

Here's what I can see :

I don't see anything about the card in the logs.

Thanks again.

Is the .js file a symlink out to your local filesystem and not included in the repo? am I doing something wrong?

Should there be a path from Grid to battery?
The battery could be charged by the solar or by the grid?
Should there be lines from both?

So you could charge off peak and use peak ?

btw. I've got the card running with very basic info for house and cars at the moment and fake info for solar and battery.
It's looking like a grey start, thanks !

I wanted to try this card as it looks really cool but I ran into some problems which can be solved and more importantly be prevented in the future by adding a bit of documentation to each sensor in the usage section of README.md:

1. What measurement is wanted? Some terms can be a bit ambiguous in some setups and a little more explanation can also help with an international community. Examples: momentary power consumed by house, accumulated energy consumption since midnight, battery state of charge
2. What unit is expected? This also helps with 1. Examples: W, kWh, %
3. How are negative values interpreted? This isn't really a problem since you have split up feed and draw but you could state how negative values are treated in general as this can help with debugging. Examples: negative values are clamped to 0

Thanks for creating this very cool card.

I was wondering if there is a way to make the line disappear when there is 0 solar being produced. Right now when it says 0 it still has the line going to the "House" wondering if there is a way to turn it off when no power is being produced?

The picture says it all.

Running Beta 1.1.4

Great new card!! Having a more structured configuration would actually make it much easier to read:

entities:
  grid:
    consumption: sensor.grid_consumption // power being fed from grid to house in (k)W
    feed: sensor.grid_feed_in // power being fed from solar panels to the grid in (k)W
  solar:
    consumption: sensor.solar_consumption  // power being fed from solar panels to house in (k)W
    production: sensor.solar_yield // power currently being produced currently by the solar panels in (k)W
  battery:
    consumption: sensor.battery_consumption  // power being fed from battery to house in (k)W
    percentage: sensor.battery_charge // % of the battery currently charged
    charging_rate: sensor.battery_charging //expects (k)W for the power being fed from the solar panels to the battery
  car:
     battery_percentage: sensor.marvin_battery_sensor // % of the battery currently charged
     charging_rate: sensor.marvin_current_charging // power being fed into car in (k)W
  car2:
     battery_percentage: sensor.marvin_battery_sensor // % of the battery currently charged
     charging_rate: sensor.marvin_current_charging // power being fed into car in (k)W
type: 'custom:tesla-style-solar-power-card'

Hi,

I have the Tesla PW Integration setup with solar panels and battery backup. In order to get the card to display properly I had to used the following configuration:

type: 'custom:tesla-style-solar-power-card'
house_consumption_entity: sensor.powerwall_load_now
grid_feed_in_entity: sensor.tesla_card_grid_feed_in
grid_consumption_entity: sensor.tesla_card_grid_consumption
grid_to_house_entity: sensor.tesla_card_grid_consumption
battery_consumption_entity: sensor.tesla_card_battery_consumption
solar_consumption_entity: sensor.tesla_card_solar_consumption
solar_yield_entity: sensor.powerwall_solar_now
generation_yield_entity: sensor.powerwall_solar_now
generation_to_grid: sensor.tesla_card_grid_feed_in
generation_to_house_entity: sensor.tesla_card_solar_consumption
generation_to_battery_entity: sensor.tesla_card_battery_charging
battery_to_house_entity: sensor.tesla_card_battery_consumption
battery_charging_entity: sensor.tesla_card_battery_charging
battery_charge_entity: sensor.powerwall_charge

The config provided in the README did not populate the battery, solar yield and consumption, or grid consumption. The sensor configs you provided worked well.

Thanks for the hard work!

These 2 have to be exclusive in the config for the animation to be correct. But when displaying grid power kW in the circle, it makes sense to display all the power being pulled from the grid, including what goes to the battery.

house_consumption_entity: sensor.smatiototalhome
grid_consumption_entity: sensor.smartiofromgrid
grid_feed_in_entity: sensor.smartiotogrid
solar_consumption_entity: sensor.smartiosolarhome
solar_yield_entity: sensor.shellyem_c7fad6_channel_2_power
type: 'custom:tesla-style-solar-power-card'

just showing NAN kW why if every sensor has values and how can I make it show in W not kW? Thanks

Hi,

First of all, thank you for your contribution on the card.

I have been using it with the old release and can't get it working anymore with the new release. Below is my card on the old release. Any assistance will be appreciated.

Thank you in advance.

type: 'custom:tesla-style-solar-power-card'
house_consumption_entity: sensor.current_consumed_positive_2
grid_consumption_entity: sensor.current_grid_positive
grid_feed_in_entity: sensor.current_solar_kwh_sold
solar_consumption_entity: sensor.current_solar_consume
solar_yield_entity: sensor.fronius_panel_status
//show_w_not_kw: 1
//hide_inactive_lines: 1
title: Solar_System