Sorry Hans-Joerg, I thought this is a reply to the member only, didn’t realize its going out to all. Next time I’ll do all in English.
1 Like
Hi gents,
this animated widget is great. After fiddling around with positve an negative values and creation of some calculation-only-items, it works perfect for me. Btw,is there a copyright on the icons / images?
Kind regards
Thomas
I have now replaced my animated energy widget with Florian’s great one.I copied the code from Github and I haven’t made changes to the original code. I have one question. For some reason there seems to be no energy flow from grid to the house even though the screen copy below shows that the power our house takes from the grid is 1876W.
Second screen copy shows that no arrows for energy transfer are shown. Energy is taken mainly from the batteries and only some power from the grid.
So what I’m missing here?
An update. Below is a screen copy of two animated energy widgets.
The upper one is florian-h05’s widget and the lower one is DrRSatzteil’s (post #79). As you can see the animated arrows are missing in the upper widget but the lower one shows correct arrows.
1 Like
Are you running latest OH? Read Florian’s posts, the part on oh-context.
Sorry, I forgot to mention that I’m running OH4.3.3.
1 Like
English version below picture
Hallo,
ich mag das Widget. Mir werden aber leider nicht alle Werte richtig angezeigt.
- Die PV Leistung wird gar nicht angezeigt, obwohl angegeben
- Die Watt beim Netzbezug werden nur angezeigt, wenn ich bei Netzbezug und Netzeinspeisung das gleiche Item setze, den Netzbezug.
- Die Ladung der Batterie wird nie angezeigt.
Ich habe schon viele Optionen, welches Item ich wo setze, ausprobiert. Das Einzige, was ich Sinnvoll hinbekomme ist die Ladung des Speichers, die Netzeinspeisung und die Entladung der Batterie.
Hat jemand eine Idee woran das liegen könnte?
English version
Hello,
I like the widget. Unfortunately, not all values are displayed correctly.
- The PV power is not displayed at all, although it is specified
- The watts for grid consumption are only displayed if I set the same item for grid consumption and grid feed-in, the grid consumption.
- The battery charge is never displayed.
I have already tried many options as to which item I set where. The only thing that makes sense to me is charging the storage tank, feeding into the grid and discharging the battery.
Does anyone have any idea what the problem could be?
There is no general advice we can give you: all depends heavily on the data you are feeding into the widget.
Is grid feeding power plus or minus? Is the load power generator plus and the consumer minus? Or vica versa?
Here is my code to compare your existing widget code, which I adapted mostly to a Fronius Inverter.
widget code
uid: PV_widget1
tags: []
props:
parameters:
- context: item
label: Grid power
name: gridpower
required: true
type: TEXT
- context: item
label: Load
name: load
required: true
type: TEXT
- context: item
label: Solar power
name: solarpower
required: true
type: TEXT
- context: item
label: Battery power
name: batterypower
required: true
type: TEXT
- context: item
label: Battery level
name: batterylevel
required: true
type: TEXT
parameterGroups: []
timestamp: Aug 16, 2024, 10:19:56 AM
component: f7-card
config:
class:
- display-flex
- flex-direction-column
- align-items-center
style:
height: 383px
slots:
content:
- component: f7-block
config:
style:
--f7-theme-color: var(--f7-text-color)
display: flex
justify-content: space-between
padding: 0
slots:
default:
- component: f7-col
config:
style:
align-items: center
display: flex
flex-direction: row
slots:
default:
- component: f7-block
config:
style:
align-items: center
display: flex
flex-direction: column
height: 110px
justify-content: center
width: 110px
slots:
default:
- component: oh-icon
config:
height: 110px
icon: sma_grid_2
- component: Label
config:
style:
color: '=items[props.gridpower].state.split(" ")[0] > 0 ? "red" :
items[props.gridpower].state.split(" ")[0] == 0 ?
"white" : "green"'
font-size: 25px
font-weight: bold
margin-top: -10px
text-align: center
width: 100px
text: =Math.abs(items[props.gridpower].state.split(" ")[0]).toFixed(0) + ' W'
- component: f7-col
config:
style:
align-items: center
display: flex
flex-direction: column
flex-grow: 1
slots:
default:
- component: f7-block
config:
style:
align-items: center
display: flex
flex-direction: column
height: 110px
justify-content: center
margin-top: 0
width: 110px
slots:
default:
- component: Label
config:
style:
font-size: 25px
font-weight: bold
text-align: center
width: 100px
text: =items[props.solarpower].displayState
- component: oh-icon
config:
height: 110px
icon: sma_pv_2
style:
margin-top: -20px
- component: f7-block
config:
style:
display: flex
justify-content: center
margin: 0
padding: 0
width: 100%
slots:
default:
- component: f7-row
config:
preserveAspectRatio: xMidYMid slice
style:
height: 100px
width: 100px
tag: svg
viewBox: 0 0 100 100
xmlns: http://www.w3.org/2000/svg
slots:
default:
- component: f7-row
config:
d: M60 -10 v10 c0 40 10 35 30 35 h20
fill: none
id: topright
stroke: rgba(100, 150, 200, 0.8)
stroke-width: 2
tag: path
vector-effect: non-scaling-stroke
visible: =items[props.batterypower].state.split(" ")[0] < 0 &&
items[props.solarpower].state.split(" ")[0] >
0
- component: f7-row
config:
fill: rgba(100, 150, 200, 0.8)
r: 6
style:
stroke-width: 4
tag: circle
vector-effect: non-scaling-stroke
visible: =items[props.batterypower].state.split(" ")[0] < 0 &&
items[props.solarpower].state.split(" ")[0] >
0
slots:
default:
- component: f7-row
config:
calcMode: linear
dur: 4s
repeatCount: indefinite
tag: animateMotion
slots:
default:
- component: f7-row
config:
tag: mpath
xlink:href: "#topright"
- component: f7-row
config:
d: M40 -10 v10 c0 40 -10 35 -30 35 h-20
fill: none
id: topleft
stroke: rgba(100, 150, 200, 0.8)
stroke-width: 2
tag: path
vector-effect: non-scaling-stroke
visible: =items[props.solarpower].state.split(" ")[0] > 0 &&
items[props.gridpower].state.split(" ")[0] < 0
- component: f7-row
config:
fill: rgba(100, 150, 200, 0.8)
r: 6
strokeWidth: 10
tag: circle
vectorEffect: non-scaling-stroke
visible: =items[props.solarpower].state.split(" ")[0] > 0 &&
items[props.gridpower].state.split(" ")[0] < 0
slots:
default:
- component: f7-row
config:
calcMode: linear
dur: 4s
repeatCount: indefinite
tag: animateMotion
slots:
default:
- component: f7-row
config:
tag: mpath
xlink:href: "#topleft"
- component: f7-row
config:
d: M50, 0 v100
fill: none
id: vertical
stroke: rgba(100, 150, 200, 0.8)
stroke-width: 2
tag: path
vector-effect: non-scaling-stroke
visible: =items[props.solarpower].state.split(" ")[0] > 0
- component: f7-row
config:
fill: rgba(100, 150, 200, 0.8)
r: 6
strokeWidth: 10
tag: circle
vectorEffect: non-scaling-stroke
visible: =items[props.solarpower].state.split(" ")[0] > 0
slots:
default:
- component: f7-row
config:
calcMode: linear
dur: 4s
repeatCount: indefinite
tag: animateMotion
slots:
default:
- component: f7-row
config:
tag: mpath
xlink:href: "#vertical"
- component: f7-row
config:
d: M-5 55 l10 0 c40 0 35 10 35 50 l0 20
fill: none
id: botleft
stroke: rgba(100, 150, 200, 0.8)
stroke-width: 2
tag: path
vector-effect: non-scaling-stroke
visible: =items[props.gridpower].state.split(" ")[0] > 0
- component: f7-row
config:
fill: rgba(100, 150, 200, 0.8)
r: 6
strokeWidth: 10
tag: circle
vectorEffect: non-scaling-stroke
visible: =items[props.gridpower].state.split(" ")[0] > 0
slots:
default:
- component: f7-row
config:
calcMode: linear
dur: 4s
repeatCount: indefinite
tag: animateMotion
slots:
default:
- component: f7-row
config:
tag: mpath
xlink:href: "#botleft"
- component: f7-row
config:
d: '=items[props.gridpower].state.split(" ")[0] > 0 ? "M0, 45 h100" : "M100, 45
h-100"'
fill: none
id: horizontal
stroke: rgba(100, 150, 200, 0.8)
stroke-width: 2
tag: path
vector-effect: non-scaling-stroke
visible: =(items[props.gridpower].state.split(" ")[0] > 0 &&
items[props.solarpower].state.split(" ")[0] <
Math.abs(Math.min(0,
items[props.batterypower].state.split("
")[0]))) ||
(items[props.batterypower].state.split(" ")[0]
> 0 && items[props.gridpower].state.split("
")[0] < 0 &&
items[props.solarpower].state.split(" ")[0] <=
0)
- component: f7-row
config:
fill: rgba(100, 150, 200, 0.8)
r: 6
strokeWidth: 10
tag: circle
vectorEffect: non-scaling-stroke
visible: =(items[props.gridpower].state.split(" ")[0] > 0 &&
items[props.solarpower].state.split(" ")[0] <
Math.abs(Math.min(0,
items[props.batterypower].state.split("
")[0]))) ||
(items[props.batterypower].state.split(" ")[0]
> 0 && items[props.gridpower].state.split("
")[0] < 0 &&
items[props.solarpower].state.split(" ")[0] <=
0)
slots:
default:
- component: f7-row
config:
calcMode: linear
dur: 4s
repeatCount: indefinite
tag: animateMotion
slots:
default:
- component: f7-row
config:
tag: mpath
xlink:href: "#horizontal"
- component: f7-row
config:
d: M 105 55 l-10 0 c-40 0 -35 10 -35 50 l0 20
fill: none
id: botright
stroke: rgba(100, 150, 200, 0.8)
stroke-width: 2
tag: path
vector-effect: non-scaling-stroke
visible: =items[props.batterypower].state.split(" ")[0] > 0
- component: f7-row
config:
fill: rgba(100, 150, 200, 0.8)
r: 6
strokeWidth: 10
tag: circle
vectorEffect: non-scaling-stroke
visible: =items[props.batterypower].state.split(" ")[0] > 0
slots:
default:
- component: f7-row
config:
calcMode: linear
dur: 4s
repeatCount: indefinite
tag: animateMotion
slots:
default:
- component: f7-row
config:
tag: mpath
xlink:href: "#botright"
- component: f7-block
config:
style:
align-items: center
display: flex
flex-direction: column
height: 110px
justify-content: center
margin-top: -10px
width: 110px
slots:
default:
- component: oh-icon
config:
height: 110px
icon: sma_consumption_2
- component: Label
config:
style:
font-size: 25px
font-weight: bold
margin-top: -10px
text-align: center
width: 100px
text: =Math.abs(items[props.load].state.split(" ")[0]).toFixed(0) + ' W'
- component: f7-col
config:
style:
align-items: center
display: flex
flex-direction: row
slots:
default:
- component: f7-block
config:
style:
align-items: center
display: flex
flex-direction: column
height: 110px
justify-content: center
width: 110px
slots:
default:
- component: oh-link
config:
action: analyzer
actionAnalyzerCoordSystem: time
actionAnalyzerItems: =[props.batterylevel]
iconColor: '=items[props.batterylevel].state.split(" ")[0] < 75 ?
items[props.batterylevel].state.split(" ")[0] < 10 ?
"red" : "orange" : "green"'
iconF7: '=items[props.batterylevel].state.split(" ")[0] < 75 ?
items[props.batterylevel].state.split(" ")[0] < 10 ?
"battery_0" : "battery_25" : "battery_100"'
iconSize: 33px
style:
font-size: 25px
font-weight: bold
position: absolute
top: -25px
white-space: nowrap
text: =Math.abs(items[props.batterylevel].state.split(" ")[0]).toFixed(0) + ' %'
- component: oh-icon
config:
height: 110px
icon: sma_battery_2
- component: Label
config:
style:
color: '=items[props.batterypower].state.split(" ")[0] > 0 ? "red" :
items[props.batterypower].state.split(" ")[0] == 0
? "white" : "green"'
font-size: 25px
font-weight: bold
margin-top: -10px
text-align: center
white-space: nowrap
width: 100px
text: =Math.abs(items[props.batterypower].state.split(" ")[0]).toFixed(0) + ' W'
Please don’t do that, only write in English, this is an international forum.
Imagine all non native English speakers would post their own French, Italian, Spanish, Russian, Polish, … language in addition to English: it would clutter the forum to no availabilty.
Oh, sorry. You’re right that it would get out of hand if everyone did that. I hadn’t considered that. I’ll leave that out in future.
Thank you for your code. It fits better. I just had to change the value for load to Kwh, as my smart meter can’t give the actual consumption values, only what comes in.
But it does not show the solar power value, as you do in watts. I only get a display there if I take the daily value or the total output in Kwh as an item. It also does not show the current flow to the battery for charging. Am I setting the wrong items?
My solar modules charge a battery (solar farm). The battery charges itself or passes the electricity on to the inverter (AP_Systems_EZ1), which feeds it into the house. Which item should go where?
1 Like
For my version of that widget I am using:
Grid power: negative values = drawing from grid, positive values = feeding into grid
Load: total electricity consumption
Solar power: total solar power generated
Battery power: negative values = drawing from battery, positive values charging the battery
Battery level: SoC of battery
If you have different items, you need to adapt your widget code.
What would I have to change if I wanted to display the current output of the solar modules instead of the total solar energy generated?
I’m terrible at this kind of programming. I have tried to make the changes myself. But I can’t get through.
You need to put the item carrying the current solar output value in the “Solar power” field.