Darstellung Sonnenbatterie

[yersinia]

Liegt einerseits an den großen Schriften für die Leistungswerte und die Prozentbalken für EV und AU sind auch vieeel zu mächtig und verdrängen die Aufmerksamkeit von den Energieflussdarstellung.

Das ist ja nichts, was man nicht hinbekommen würde; aber ja, der Platz ist begrenzt, ausgereizt und irgendwie wollen AU und EV nirgends so richtig Platz finden.

Was geht denn da so alles in den pipes? Bislang dachte ich, da gehen nur in FTUI3 definierte Befehle, aber anscheinend geht dort noch wesentlich mehr.

Da geht ne Menge; alles was JavaScript kann. Du kannst auch eigene Funktionen aufrufen usw.

Gibt es dazu eine Doku?

Ja, gibt es. ; insbesondere mr_petz und OdfFhem haben hier wirklich viel gezeigt.

Edit: man könnte auch mit Kreisen arbeiten, sind ggf etwas dezenter als Ladebalken. Siehe zweites Bild.
Edit II: anbei eine Version, welche Autarkie und Eigenverbrauch als Kreise (circle) oder Ladebalken (flow) darstellt - die Prozentwerte (0-100) kommen aus einem FHEM-Device.

[papa]

@papa: Danke für den Vorschlag, dass man ja FTUI Elemente per HTML übereinander legen könnte. Da würde mich mal interessieren, wie man das konkret macht. Bislang dachte ich, dass man, wenn man den freien Platz in pvvis nutzen möchte, auch in pvvis rein muss und das dort einbauen muss.

Google "html div overlay" sagt z.B. https://stackoverflow.com/questions/2941189/how-to-overlay-one-div-over-another-div

[docolli]

Da pvvis nicht weiss, welche Werte in welchen Einheiten übergeben werden und ich eigtl auch nicht auf optionalen Einheiten prüfen möchte, sehe ich da derzeit keine saubere Möglichkeit, dass zu implementieren.

Ich kann mir allerdings vorstellen, dass es FHEM-seitig bereits (user)readings gibt, die dann entsprechend Werte umwandeln (zB ab 999[W] => 1[kW]). Demnach kann es ein weiteres (user)reading geben, welches dann entsprechend Wh auf kWh ändert und entsprechend eingebunden wird, in etwa so:

Code: [Auswählen]

[unit-value]="DEVICE:READING"
[unit-sum]="DEVICE:READING"
Was schwierig werden funktionieren könnte ist eine pipe:

Code: [Auswählen]

[unit-value]="DEVICE:READING | step('0:`W`, 1000:`kW`')"weil und dann die Werte unter zB produce analog geändert werden müssten ändern (ungetestet):

Code: [Auswählen]

[produce]="DEVICE:READING | v=>Number(v)>=1000?(v/1000):v"Hat aber den Nachteil, dass pvvis in der Darstellung angepasst werden muss und der user alle readings gleichbehandeln muss: wenn zB produce von 3800W auf 3.8kW gekürzt wird, muss zB die Akkuladung (charge, discharge, charge-discharge) auch von 400W auf 0.4kW reduziert werden. Dies allein in FTUI3 bzw pvvis abzubilden ist quasi unmöglich (zumindest nach meinem derzeitigen Kenntnisstand) - daher: userReading in FHEM!

Wird so nicht funktionieren, da unit-value für ALLE Werte gilt, du aber mit der pipe jeden einzelnen Wert in W oder kWh umrechnest.
Damit es geht müsste man definieren, in welcher Einheit die Werte an pvvis übergeben werden müssen (z.B. in W), dann kann das in pvvis sauber umgerechnet werden.
Somit könnte man sich aber die Übergabe der unit sparen.

Nochmals danke für den Tipp mit DIV-Overlay. Damit komme ich deutlich weiter und muss mich nicht in pvvis einmischen 😁🤣.

[docolli]

Dank des Tips von @papa konnte ich nun Eigenverbrauch und Autarkie im Dashboard unserer Firma mit Hilfe von label und slider folgendermaßen darstellen (siehe Bild).
Werte werden jetzt alle als userreading im FHEM device berechnet.
Aus bestimmten Gründen nutze ich hier nicht die in pvvis intergrierte Darstellung der Summernwerte. Wir wollen auch den Vergleich zum Vortag haben.

Bei Interesse teile ich gerne die userreadings bzw. das div-Konstrukt, damit auch jemand anderes eine Basis für eigene Overlays hat.

[octek0815]

Dank des Tips von @papa konnte ich nun Eigenverbrauch und Autarkie im Dashboard unserer Firma mit Hilfe von label und slider folgendermaßen darstellen (siehe Bild).
Werte werden jetzt alle als userreading im FHEM device berechnet.
Aus bestimmten Gründen nutze ich hier nicht die in pvvis intergrierte Darstellung der Summernwerte. Wir wollen auch den Vergleich zum Vortag haben.

Bei Interesse teile ich gerne die userreadings bzw. das div-Konstrukt, damit auch jemand anderes eine Basis für eigene Overlays hat.

Moin,

kannst Du den Code dafür zeigen, sieht gut aus. Auch das mit den Vortagswerten ist super.

Grüße
Olli

[docolli]

Ich habe folgende userreadings, der besseren Lesbarkeit wegen mit extra Zeilen getrennt:

Code: [Auswählen]

Haus-Stromverbrauch_tag integral { ReadingsVal($NAME,"Haus-Stromverbrauch",0)/3600 },
PV-Erzeugung_tag integral { ReadingsVal($NAME,"PV-Erzeugung",0)/3600 },
AKKU_tag integral { ReadingsVal($NAME,"AKKU-Entnahme",0)/3600 },

Netz-Einspeisung_1  { min(ReadingsVal($NAME,"Netz-Einspeisung",0),0)*-1 },
Netz-Bezug_1  { max(ReadingsVal($NAME,"Netz-Einspeisung",0),0) },

Netz-Einspeisung_tag integral { ReadingsVal($NAME,"Netz-Einspeisung_1",0)/3600 },
Netz-Bezug_tag integral { ReadingsVal($NAME,"Netz-Bezug_1",0)/3600 },

Autarkie { ( 1 - ReadingsVal($NAME,"Netz-Bezug_tag",0) / ReadingsVal($NAME,"Haus-Stromverbrauch_tag",0) ) *100 },
Eigenverbrauch { (  (ReadingsVal($NAME,"PV-Erzeugung_tag",0) -  ReadingsVal($NAME,"Netz-Einspeisung_tag",0)) / ReadingsVal($NAME,"PV-Erzeugung_tag",0) ) *100 }

Mit den ersten drei integriere ich die Werte von Haus/PV/Akku-Entnahme auf.
Da das Senec System mir den Netzbezug/Einspeisung als einen Wert, aber positiv/negativ gibt, splitte ich den Wert in zwei temporäre readings per min/max Funktion auf. Dann kann ich wieder getrennt darüber integrieren.

Autarkie und Eigenverbrauch Berechnung ist nur mal so formuliert, da ist noch kein DivisionByZero abgefangen...

Zusätzlich haben ich noch ein AT Device, dass mir um 23:59:59 die Werte von "*_tag" auf "*_gestern" per setreading Befehl kopiert und dann "'_tag" auf Null setzt. Beispiel:

Code: [Auswählen]

fhem('setreading DEVICE AKKU_gestern [DEVICE :AKKU_tag]'),
fhem('setreading DEVICE AKKU_tag 0'),

Anmerkung:
DEVICE=<eigener Device Name>


[docolli]

Dazu kommt noch die <div> Magie, um (ftui)-Elemente über dem pvvis Element zu platzieren.

Code: [Auswählen]

<div style="position: relative;">
<ftui-pvvis
....
width="500px"
margin="50px 50px 50px 50px">
</ftui-pvvis>
<div style="position: absolute; top: 0%; transform: translate(313px, 85px);">
<ftui-label [text]="DEVICE:PV-Erzeugung_tag | multiply(0.001) | round (1) | fix(1)" unit=" kWh" size="1">Heute </ftui-label>
</div>
<div style="position: absolute; top: 0%; transform: translate(313px, 100px);">
<ftui-label [text]="DEVICE:PV-Erzeugung_gestern | multiply(0.001) | round (1) | fix(1)" unit=" kWh" size="1">Gestern </ftui-label>
</div>
                                .....
<div style="position: absolute; top: 0%; transform: translate(3px, 20px); width: 180px;">
<ftui-label [text]="DEVICE:Autarkie | round(0)" unit="%" size="1">Autarkie: </ftui-label>
<ftui-slider [value]="DEVICE:Autarkie" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0px 0px 0px"></ftui-slider>
</div>
<div style="position: absolute; top: 0%; transform: translate(3px, 80px); width: 180px;">
<ftui-label [text]="DEVICE:Eigenverbrauch | round(0)" unit="%" size="1">Eigenverbrauch: </ftui-label>
<ftui-slider [value]="DEVICE:Eigenverbrauch" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0px 0px 0px"></ftui-slider>
</div>
                         </div>


Mein pvvis ist 500px breit mit dem angebenen Rand. Das muss man anpassen, genauso die Position der einzelnen div Elemente. Nur mal zum zeigen, wie es gehen kann. Der Einfachheit halber habe ich nicht mit CSS Klassen gearbeitet, sondern das style attribut direkt ins div Tag geschrieben.

[docolli]

Jetzt kommt doch noch ein Problem, wenn ich das in mein FTUI Zuhause einbauen will.

Hier ist mein pvvis nur 290px breit. Um also die zwei Slider oben links zu positionieren, muss ich diese (samt Schrift) verkleinern.
Ich habe das per scale auf 70% versucht, aber dann stimmt die Skalierung des Sliders nicht mehr. 99% sind nicht ganz rechts.
Siehe Bild.
Irgendjemand eine Idee was ich da machen kann?

Code: [Auswählen]

<div style="position: absolute; top: 0%; transform: scale(0.7) translate(-40px,58px); width:180px;">
<ftui-label [text]="E3DC_S10E:Autarkie | round(0)" unit="%" size="1">Autarkie: </ftui-label>
<ftui-slider [value]="E3DC_S10E:Autarkie" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0px 0px 0px"></ftui-slider>
</div>
<div style="position: absolute; top: 0%; transform: scale(0.7) translate(-40px,3px); width: 180px;">
<ftui-label [text]="E3DC_S10E:Eigenverbrauch | round(0)" unit="%" size="1">Eigenverbrauch: </ftui-label>
<ftui-slider [value]="E3DC_S10E:Eigenverbrauch" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0px 0px 0px"></ftui-slider>
</div>



[mr_petz]

@docolli

Kannst es so mal testen:

Code: [Auswählen]

<div style="position: relative;">
  <ftui-pvvis
    ...
    width="290px">
  </ftui-pvvis>
  <ftui-cell style="position: absolute; top: 0; left:-40px; width:47%;">
    <ftui-label [text]="E3DC_S10E:Autarkie | round(0)" unit="%" size="1" width="100%">Autarkie: </ftui-label>
    <ftui-slider [value]="E3DC_S10E:Autarkie" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0 25px 0" style="width: 100%;"></ftui-slider>
    <ftui-label [text]="E3DC_S10E:Eigenverbrauch | round(0)" unit="%" size="1" width="100%">Eigenverbrauch: </ftui-label>
    <ftui-slider [value]="E3DC_S10E:Eigenverbrauch" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0 0 0" style="width: 100%;"></ftui-slider>
  </ftui-cell>
</div>
Habe die slider und dazugehörigen label in eine ftui-cell gepackt.
Bei mir wird alles richtig gesetzt im slider...
Die passende Größe musst du halt noch anpassen im ftui-cell style. Left dann auch. Mehr brauchst du da eigentlich nicht...

LG mr_petz

Edit:
hier noch reduzierter:

Code: [Auswählen]

  <ftui-cell style="position: absolute; top: 0; left:5px; width:30%;">
    <ftui-label [text]="E3DC_S10E:Autarkie | round(0)" unit="%" class="size--1" width="100%">Autarkie: </ftui-label>
    <ftui-slider [value]="E3DC_S10E:Autarkie" readonly min="0" max="100" class="size--1" handle="none" tick="25" has-ruler margin="5px 0 25px 0" style="width: 100%;"></ftui-slider>
    <ftui-label [text]="E3DC_S10E:Eigenverbrauch | round(0)" unit="%" class="size--1" width="100%">Eigenverbrauch: </ftui-label>
    <ftui-slider [value]="E3DC_S10E:Eigenverbrauch" readonly min="0" class="size--1" max="100" handle="none" tick="25" has-ruler margin="5px 0 0 0" style="width: 100%;"></ftui-slider>
  </ftui-cell>


[docolli]

Danke, hab's gleich ausprobiert, leider nicht mit dem gewünschten Ergebnis.

Code: [Auswählen]

<ftui-cell style="position: absolute; top: 0%; transform: scale(0.7) translate(-80px,3px); width: 180px;">
<ftui-label [text]="E3DC_S10E:Eigenverbrauch | round(0)" unit="%" size="1">Eigenverbrauch: </ftui-label>
<ftui-slider [value]="E3DC_S10E:Eigenverbrauch" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0px 0px 0px"></ftui-slider>
</ftui-cell>
<ftui-cell style="position: absolute; top: 0%; transform: translate(-20px,38px); width: 45%;">
<ftui-label [text]="E3DC_S10E:Eigenverbrauch | round(0)" unit="%" size="1">Eigenverbrauch: </ftui-label>
<ftui-slider [value]="E3DC_S10E:Eigenverbrauch" readonly min="0" max="100" handle="none" tick="25" has-ruler margin="5px 0px 0px 0px"></ftui-slider>
</ftui-cell>

Der untere Slider ist nicht skaliert, sondern in der Breite so angepasst, wie du vorgeschlagen hast. Damit stimmt zwar dann die Werteanzeige im Balken, aber die Schriften (und der Rest) werden damit nicht runter skaliert. Ich hätte gerne den Slider samt Beschriftung in einer Box, den kompletten Inhalt aber passend auf 70% runter skaliert. Dann passt das gut links oben hin und drängt sich auch nicht so auf.

[mr_petz]

Nimm doch das 2.Beispiel und nur eine cell!
Durch die %Angabe scaliert es doch...

[docolli]

Sorry, dachte ich hätte grundsätzlich verstanden woran es bei mir gelegen hat.
Offensichtlich nicht! 

Danke für den Hinweis.

[stenny]

Moin,

auch auf die Gefahr das ich erschlagen werde....

Welche Dateien sind jetzt die Aktuellen für die FTUI2.


Gruß
Carsten

[mr_petz]

@stenny

Diese hier sollten es sein:
von @papa
https://forum.fhem.de/index.php/topic,119440.msg1231479.html#msg1231479

von @fred_feuerstein
https://forum.fhem.de/index.php/topic,119440.msg1244211.html#msg1244211

LG

[stenny]

Danke