Energy Dashboard - Template

[MeneerKlaas]

Hi eddieb, this was my choose, since you now can also disable Solar (and Gas). Then the values align more nicely.
But I agree with you. The purple line on top is nicer. With the next version I will change it back.

[Sjonnie2017]

I have been experimenting with this dashboard and could use some help getting things to work. I get the readings for gas but not for electricity. The IDX for my (YouLess) P1 meter Electricity is 199.

2024-05-20_15-54.png (13.09 KiB) Viewed 2094 times

The result for this code:

Code: Select all

$.getJSON('/json.htm?type=command&param=getdevices&rid=199', function(data){
  console.log('CounterToday: ' + parseFloat(data["result"][0]["CounterToday"].slice(0, -4).replace(',','.')));
  console.log('CounterDelivToday: ' + parseFloat(data["result"][0]["CounterDelivToday"].slice(0, -4).replace(',','.')));
  console.log('Usage: ' + parseFloat(data["result"][0]["Usage"].slice(0, -5).replace(',','.')));
  console.log('UsageDeliv: ' + parseFloat(data["result"][0]["UsageDeliv"].slice(0, -5).replace(',','.')));
});

is

Code: Select all

$.getJSON('/json.htm?type=command&param=getdevices&rid=199', function(data){
  console.log('CounterToday: ' + parseFloat(data["result"][0]["CounterToday"].slice(0, -4).replace(',','.')));
  console.log('CounterDelivToday: ' + parseFloat(data["result"][0]["CounterDelivToday"].slice(0, -4).replace(',','.')));
  console.log('Usage: ' + parseFloat(data["result"][0]["Usage"].slice(0, -5).replace(',','.')));
  console.log('UsageDeliv: ' + parseFloat(data["result"][0]["UsageDeliv"].slice(0, -5).replace(',','.')));…
Object { readyState: 1, getResponseHeader: getResponseHeader(e), getAllResponseHeaders: getAllResponseHeaders(), setRequestHeader: setRequestHeader(e, t), overrideMimeType: overrideMimeType(e), statusCode: statusCode(e), abort: abort(e), state: state(), always: always(), catch: catch(e)
, … }

CounterToday: 8.233 debugger eval code:2:11
CounterDelivToday: 4.447 debugger eval code:3:11
Usage: 1481 debugger eval code:4:11
UsageDeliv: 0

Which looks OK but nothing shows in the dashboard.

I can't get any result for my SolarEdge inverter. The hardware ID is 18 but that generates no results:

Code: Select all

$.getJSON('/json.htm?type=command&param=getdevices&rid=18', function(data){
  console.log('CounterToday: ' + parseFloat(data["result"][0]["CounterToday"].slice(0, -4).replace(',','.')));
  console.log('Usage: ' + parseFloat(data["result"][0]["Usage"].slice(0, -5).replace(',','.')));
});
Object { readyState: 1, getResponseHeader: getResponseHeader(e), getAllResponseHeaders: getAllResponseHeaders(), setRequestHeader: setRequestHeader(e, t), overrideMimeType: overrideMimeType(e), statusCode: statusCode(e), abort: abort(e), state: state(), always: always(), catch: catch(e), … }

Uncaught TypeError: data.result is undefined
    <anonymous> debugger eval code:2
    jQuery 8
    <anonymous> debugger eval code:1
debugger eval code:2:45
Uncaught TypeError: data.result[0].CounterToday is undefined
    getSolar http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:39
    jQuery 8
    updatePower http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:38
    <anonymous> http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:127
192.168.xxx.190:2080:39:27
Uncaught TypeError: document.getElementById(...) is null
    updatePower http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:117
    jQuery 8
    updatePower http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:115
    <anonymous> http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:127
192.168.xxx.190:2080:117:69
Uncaught TypeError: data.result[0].CounterToday is undefined
    getSolar http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:39
    jQuery 8
    updatePower http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:38
    <anonymous> http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:127
192.168.xxx.190:2080:39:27
Uncaught TypeError: document.getElementById(...) is null
    updatePower http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:117
    jQuery 8
    updatePower http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:115
    <anonymous> http://192.168.xxx.190:2080/#/Custom/Energy Dashboard v1.1 line 2 > injectedScript:127
192.168.xxx.190:2080:117:69

I have tried a number of Device ID's but none of the give any results. These devices are available in Domoticz:

2024-05-20_16-00.png (228.2 KiB) Viewed 2094 times

Would appreciatie some guidance

[eddieb]

did you try 339 for your solaredge ?

[Sjonnie2017]

did you try 339 for your solaredge ?

Thanks for your support!

Yes, I did use that IDx but no result. I even restarted Domoticz to be sure.

Just to add: I use my SolarEdge through the Modbus TCP plugin from IronWolf (iirc). My Domoticz installation is running in a Docker environment (with the templates folder exposed to the system as per the Wiki).

EDIT: You rock! I forgot that I had to remove the cookies Silly me!

[McMelloW]

@Meneer Klaas

Thanks for this template. It works OK.

[Sjonnie2017]

Just to add: The dashboard allways shows 497,2 Watt production. Rain or shine, day or night, it never changes. Anyone any clue how to get the proper value?

Tx!

[akamming]

This is really nice. And easy to set up. ... and great improvement for the UI. Would be really nice if you click on the P1 meter that you then get this view.

Can't you create a PR to have it included as a regular feature?

[McMelloW]

Just to add: The dashboard allways shows 497,2 Watt production. Rain or shine, day or night, it never changes. Anyone any clue how to get the proper value?

My production is the same as it is in the SolarEdge app.

[DiaDomo]

Very nice! This was on my wish list!
One request : I would like to add my water meter to this dashboard. I'm not very familiar with the coding, so maybe you can help me.
The watermeter is of type: General, Counter incremental. It shows in the right top corner the amount of today (in m3) and
in the box the total amount of used water m3.
Also I have a device called Waterflow - Type General, Waterflow, showing the waterflow in liter per minute. This could maybe also be added to the dashboard.
I would appreciate your help very much.

[Sjonnie2017]

My production is the same as it is in the SolarEdge app.

Great! So it should work with a SolarEdge converter Could you show me which Domoticz device you used? Might be that I am using the wrong one

[McMelloW]

My production is the same as it is in the SolarEdge app.

Great! So it should work with a SolarEdge converter Could you show me which Domoticz device you used? Might be that I am using the wrong one

idP1 = Power - (Energy subtype)
idSolar = Total Energy (General subtype) - kWh

In your picture, use 339

[Sjonnie2017]

idP1 = Power - (Energy subtype)
idSolar = Total Energy (General subtype) - kWh

In your picture, use 339

That's the device I use (339) which gives me this result. Will investigate further later on this day.

Tx foor your reply!

[eddieb]

works fine with solaredge here, no issues

[McMelloW]

That's the device I use (339) which gives me this result. Will investigate further later on this day.

Tx foor your reply!

Hi Sjonnie, my SolarEdge is connected to Domoticz with the SolarEdge Modbus TCP hardware. The values in Domoticz are directly from the inverter and change every 10 sec. The values in the app are from the SolarEdge website and change every 15 min. So the is some difference between Domoticz and the app.

The only thing I did is changed the index number for idP1Meter; idGas; idSolar. And works like a charm. Much succes in getting it working OK.

[FireWizard]

Hello @MeneerKlaas

Great job, looks good.

Using it with P1 Electricity/Gas and Enphase micro inverters.
Operational in 5-10 minutes, however do not forget to clear your browser cache.

Thank you very much for this application.

Regards

[gizmocuz]

Looking great!! Maybe something to add by default (or as example)

Would be great if a Battery could be implemented.
As a battery can import/export (like the P1), maybe it is best to use a Usage/Electric (Watt) device for this?
I am sure 'heggink' is able to tweak his two sensors into one that puts in into a Watt device
But it would also be nice to display the capacity of the battery (like 2.4 kWh)

Maybe we need two templates, one without and one with battery?

Is it possible you can check this into a Github project?

Edit: I modified your file to include the support for a battery, I'm no expert in SVG !
(And the code is not correct/finished yet)

EnergyDashboardBatt.png (42.15 KiB) Viewed 1737 times

Please feel free to use/modify it

Maybe you can place all in groups and position the groups differently when a battery is used

[gizmocuz]

@FireWizard, in the upcoming beta browser caching will be disabled for all custom template related items (page/images etc)

@MeneerKlaas, I am cooking something at the moment and optimized the SVG as well. Not sure if you are using a editor for this, but I am using a text editor now in combination with https://www.svgviewer.dev/
This is keeping everything tidy.

Adding a battery makes things a bit more complicated... some solar power can go into the battery as well

I also made the item outline a circle... It starts to look a lot like HASS this way...
Question, did you took these icons from HASS? Or did you found them on a website and are they free to use?
(For example, my battery icon is a found one)
Otherwise, it is not so nice to use them. For example, the Solar Panel icon looks like a combination of two icons specifically made for this
I know the home, gas are free to use

https://www.svgrepo.com/vectors/solar/

If I got the code right for the battery I will post the custom page here

[gizmocuz]

I think it's working. At the top of 'UpdateScreen' you can enable some debugging to test

[FireWizard]

Hi, @gizmocuz

I tested your latest version of the Energy Dashboard.

Unfortunately I'm not able to test a Battery, as I do not own it.
So I inserted -1 for idBattSetpoint and idBattSoc.

In this case the custom page displays a default value of 80%. Is that as intended?

You wrote:

@FireWizard, in the upcoming beta browser caching will be disabled for all custom template related items (page/images etc)

It has not been a problem for me to clear the cache, i mentioned it, because other users might experience the same.

One issue I discovered, compared with the first release of @MeneerKlaas.

I upgraded to the latest beta 16027 and at the same time I installed the version 1.2 of this template, followed by a restart of Domoticz.
After the restart Domoticz, I have to refresh the screen (by pressing F5) before I will see the actual values (sometimes multiple times).
Did someone noticed the same?

I'm not sure if it is caused by the new template (version 1.2) or the removal of the cache functionality in the latest beta.

Please allow me to suggest a few other changes.

1.

I also made the item outline a circle...

I prefer the circle over the rectangular shape, but that is personal

It starts to look a lot like HASS this way...

We should not copy a HASS functionality, but it is not bad if we take an idea and improve it.

So, why not take the suggestion of @DiaDomo an add a "watermeter" to this dashboard.
I.m.h.o. it is not that complicated, as the functionality is the same as the that of the "gasmeter".

Also the EV car can be added, as suggested by someone else.
The charging of a Battery is exactly the same as charging the EV The difference is probably that the car will not discharge (to your Home)

The only thing is that we have to rearrange the picture a little bit.

Someone suggested even to add it to Domoticz by default

Looking great!! Maybe something to add by default (or as example)

Move it from the "Custom" tab to the "Dashboard" tab is in my opinion a good place.

Regards, Good job

[McMelloW]

I tested your latest version of the Energy Dashboard.

Unfortunately I'm not able to test a Battery, as I do not own it.
So I inserted -1 for idBattSetpoint and idBattSoc.

In this case the custom page displays a default value of 80%. Is that as intended?

@FireWizard
Have a look at this at this topic https://www.domoticz.com/forum/viewtopi ... al+battery about a Virtual Solar Battery