Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄

[Qlink]

Hi Leute,

ich würde gerne meine PV Anlage mit den justgage Widgets visualisieren. Für die PV Erzeugung und den Gesamtverbrauch ist das auch kein Problem und relativ straightforward.
aktuell sieht es bei mir so aus:

Schwierig wirds bei Netzbezug bzw. Netzeinspeisung. Ich hätte gerne diese beiden Werte in einem justgage widget angezeigt. (aktuell habe ich nur den Wert Netzbezug eingebunden, wenn ich mehr prodziere als beziehe zeigt mir das Widget aktuell nur 0W an...)

Ich hätte gerne in der Mitte den Wert 0
-> wenn ich mehr Strom verbrauche als produziert wird soll die Anzeige nach links gehen und den aktuellen Netzbezug in Orange anzeigen
-> wenn ich mehr Strom produziere als ich aktuell verbrauche soll die Anzeige nach rechts gehen und die aktuelle Netzeinspeisung in Grün anzeigen

Weiß jemand ob sich das so umsetzen lässt und wenn ja wie ?

Besten Dank für eure Unterstützung.

[sigi234]

Welchen Datenpunkt hast du für 0?

[liv-in-sky]

ich glaube du kannst den bereich von -x bis +x setzen - dann farblich markieren und schon funzt es

[Homoran]

@Qlink
ich habe dafür die rgraph gauges:

Habe gerade den Chart geändert, die Gauges noch nicht auf deren Farbgebung und Datenpunkte angepasst.

[Qlink]

@sigi234 Ich hab da einfach 0 eingegeben.

@liv-in-sky das problem ist dass ich 2 Datenpunkte einstellen müsste aber nur einen einstellen kann

@Homoran ja mit denen würde es gehen, da kann man sogar bis zu 3 Datenpunkte eingeben. Das Problem ist nur, sie gefallen mir optisch überhaupt nicht. Sie sind mir viel zu unruhig ... Das passt sogar nicht in meine eher schlicht gehaltenen Views ...

Ich hätte auch schon versucht den Netzeinspeisungswert per Blockly mit -1 zu multiplizieren, damit ich ihn als Negativwert habe. Diesen hätte ich dann als min Wert im widget definiert, aber auch das klappt nicht:

[liv-in-sky]

könntest du das nicht mit einem script lösen - die vis-widget bleibt dasselbe nur ein script füttert die anzeige

[Qlink]

k.A. ... :(

Ich habe bisher noch nicht mal rausgefunden, ob mit den justgauge widgets die gewünschte Funktion, 2 Werte in einem Widget darzustellen, überhaupt möglich ist ...

Wenn die Widgets die Möglichkeit bieten, dann lässt sich der Rest sicher auch irgendwie lösen.
Ist die Antwort auf die obige Frage aber nein, dann ist das wohl ein KO Kriterium ...

[stimezo]

Ist eigentlich einfach :relaxed:

Du hast 2 Datenpunkte und einen Wert, den Du visualisieren willst.
Du musst also die beiden DP mittels Script verrechnen, daraus ergibt sich dein
Wert, der ist negativ wenn Du mehr Strom verbrauchst als Du produzierst und
positiv wenn Du einen Überschuss hast.
Der lässt sich mit Deinem Widget wunderbar darstellen.

Viele Grüße
Chrsitian

[Segway]

@stimezo sagte in ein justgage widget mit 2 werten möglich?:

Du musst also die beiden DP mittels Script verrechnen, daraus ergibt sich dein
Wert, der ist negativ wenn Du mehr Strom verbrauchst als Du produzierst und
positiv wenn Du einen Überschuss hast.

Genau, so würde ich es auch machen :+1:

[liv-in-sky]

joo - so meinte ich das

[Qlink]

aaaahh, jetzt verstehe ich was ihr meint. Jetzt hats Klick gemacht :)

Danke für die Hilfe!

Ich hab das mal auf die Schnelle so zusammengeklickt:

Mal schauen ob das so funktioniert. Jetzt muss ich nur noch warten bis bei uns die Sonne stark genug ist, dass ich mehr produziere als verbrauche um zu sehen ob das so passt ...

Eines fällt mir aber jetzt schon störend auf.
Der Anzeigebalken bei Netzbezug ist genau verkehrt herum, weil in der Mitte 0 ist und links -10000... :(
Also wenn ich wenig Netzbezug habe zeigt der Balken viel an und wenn ich viel Netzbezug habe zeigt der Balken wenig an ...

Kann ich das auch noch irgendwie umkehren ?

[liv-in-sky]

du musst nicht wirklich auf die sonne warten - ersetze die beiden datenpunkte mit test-datenpunkten (die du von hand ändern kannst)- dann kannst du eingeben was du willst und siehst das ergebnis

ganz versteh ich nicht was du ändern willst - aber bringt max und min austauschen im widget , das was du brauchst?

[I-Punkt]

Vielleicht auch eine Idee: Zwei dieser Widgets deckungsgleich über einander legen. Das untere ist orange/0/grün, das obere weiß/0/transparent (falls das geht) Dann unten die Einspeisung und drüber den negativen Netzbezug. Geht der Netzbezug zurück (negative Zahl wird kleiner) vergrößert sich der weiße Teil und deckt immer mehr von dem unten liegenden orangen Teil ab. Das geht bis 0 und ab da kommt dann Stück für Stück mit zunehmender Einspeisung der grüne Bereich zum Vorschein.

Oder zwei Viertelkreise nebeneinander zu einem Halbkreis und den linken mit "negativer" Drehrichtung.

[liv-in-sky]

falls trasnsparent gebraucht wird : als farbe rgba(100,100,100,0) eingeben

nicht wundern - es verwchwindet auch die schrift im farb-setting-feld -

[liv-in-sky]

mit deinem widget hab ich das nicht hinbekommen (man kann die laufrichtung nicht ändern ) - hab mal ein widget dazugefügt - damit gehts
es handelt sich um drei widgets, die je nach datenwert ein- und ausgeblendet werden - minus - 0 - plus (die widgets liegen aufeinander)
der null wert wird nicht oft sichtbar sein , es sei den du rundest in deinem script - ansonsten könntest du ja noch die einzelnen widgets anpassen bzw den unteren teil abdecken. die werte müssen auf jeden fall angepasst werden.

Spoiler

[{"tpl":"tplCGradialGauge","data":{"g_fixed":false,"g_visibility":true,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":">","visibility-val":"0","visibility-groups-action":"hide","factor":"","valueOffset":"0","hCount":"1","minorTicks":"3","animation":"true","needle":true,"needleShadow":true,"needleType":"arrow","borders":"true","borderOuterWidth":"2","borderMiddleWidth":"2","borderInnerWidth":"2","borderShadowWidth":"2","valueBox":"false","ticksAngle":"180","startAngle":"90","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"oid":"controll-own.0.test","units":"KW","title":"test","minValue":"-10","maxValue":"10","needleWidth":"7","needleStart":"0","needleEnd":"79","colorPlate":"#321a1a","colorNumbers":"#0cd419","valueBoxStroke":"4","valueBoxBorderRadius":"0","colorNeedle":"#1ac730","colorNeedleEnd":"#bffabd","fontNumbersSize":"45","fontNumbersStyle":"normal","fontUnitsStyle":"normal","colorBorderShadow":"#000000","colorBorderOuter":"#000000","colorBorderOuterEnd":"#000000","colorBorderMiddle":"#000000","colorBorderMiddleEnd":"#000000","colorBorderInner":"#000000","colorBorderInnerEnd":"#000000","colorValueText":"#0cd419","colorMajorTicks":"#1ac730","colorMinorTicks":"#0cd419","colorTitle":"#0cd419","colorUnits":"#0cd419","needleCircleInner":false,"needleCircleOuter":false,"majorTicks":"6","visibility-oid":"controll-own.0.test"},"style":{"left":"940px","top":"620px","width":"150px","height":"200px"},"widgetSet":"canvas-gauges"},{"tpl":"tplCGradialGauge","data":{"g_fixed":false,"g_visibility":true,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"<","visibility-val":"0","visibility-groups-action":"hide","factor":"1","valueOffset":"0","hCount":"1","minorTicks":"3","animation":"true","needle":true,"needleShadow":true,"needleType":"arrow","borders":"true","borderOuterWidth":"2","borderMiddleWidth":"2","borderInnerWidth":"2","borderShadowWidth":"2","valueBox":"false","ticksAngle":"180","startAngle":"90","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"oid":"controll-own.0.test","units":"KW","title":"test","minValue":"-10","maxValue":"10","needleWidth":"7","needleStart":"0","needleEnd":"79","colorPlate":"#321a1a","colorNumbers":"#c71a3b","valueBoxStroke":"4","valueBoxBorderRadius":"0","colorNeedle":"#c71a3b","colorNeedleEnd":"#c71a3b","fontNumbersSize":"45","fontNumbersStyle":"normal","fontUnitsStyle":"normal","colorBorderShadow":"#000000","colorBorderOuter":"#000000","colorBorderOuterEnd":"#000000","colorBorderMiddle":"#000000","colorBorderMiddleEnd":"#000000","colorBorderInner":"#000000","colorBorderInnerEnd":"#000000","colorValueText":"#c71a3b","colorMajorTicks":"#c71a3b","colorMinorTicks":"#c71a3b","colorTitle":"#c71a3b","colorUnits":"#c71a3b","needleCircleInner":false,"needleCircleOuter":false,"majorTicks":"6","visibility-oid":"controll-own.0.test"},"style":{"left":"940px","top":"620px","width":"150px","height":"200px"},"widgetSet":"canvas-gauges"},{"tpl":"tplCGradialGauge","data":{"g_fixed":false,"g_visibility":true,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":"0","visibility-groups-action":"hide","factor":"1","valueOffset":"0","hCount":"1","minorTicks":"3","animation":"true","needle":true,"needleShadow":true,"needleType":"arrow","borders":"true","borderOuterWidth":"2","borderMiddleWidth":"2","borderInnerWidth":"2","borderShadowWidth":"2","valueBox":"false","ticksAngle":"180","startAngle":"90","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"oid":"controll-own.0.test","units":"KW","title":"test","minValue":"-10","maxValue":"10","needleWidth":"7","needleStart":"0","needleEnd":"79","colorPlate":"#321a1a","colorNumbers":"#f4ed66","valueBoxStroke":"4","valueBoxBorderRadius":"0","colorNeedle":"#f4ed66","colorNeedleEnd":"#f4ed66","fontNumbersSize":"45","fontNumbersStyle":"normal","fontUnitsStyle":"normal","colorBorderShadow":"#000000","colorBorderOuter":"#000000","colorBorderOuterEnd":"#000000","colorBorderMiddle":"#000000","colorBorderMiddleEnd":"#000000","colorBorderInner":"#000000","colorBorderInnerEnd":"#000000","colorValueText":"#f4ed66","colorMajorTicks":"#f4ed66","colorMinorTicks":"#f4ed66","colorTitle":"#f4ed66","colorUnits":"#f4ed66","needleCircleInner":false,"needleCircleOuter":false,"majorTicks":"6","visibility-oid":"controll-own.0.test"},"style":{"left":"940px","top":"620px","width":"150px","height":"200px"},"widgetSet":"canvas-gauges"}]

[I-Punkt]

Challenge accepted... :relaxed:

Ich habe mal die Variante mit den zwei Viertelkreisen umgesetzt. Die DP sind Netzbezug [-10...0] und Einspeisung [0...10] Im Beispiel sind einmal eingestellt Netzbezug -6 / Einspeisung 0 und einmal Netzbezug 0 / Einspeisung 5

Bei den Einstellung gibt es unten "gegen Uhrzeigersinn". Habe ich hier nicht gebraucht, da die Netzbezugswerte negativ sind. Wären diese positiv, könnte man hier mit arbeiten.

[liv-in-sky]

oh mann - du hast ein anderes widget - da ist das mit dem gegenuhrzeiger drin . wie bitte heißt dein widget .

[Qlink]

wollte ich auch grad fragen, weil bei den justgage widgets welche ich verwende habe ich ganz andere einstellmöglichkeiten ...

[I-Punkt]

Ich habe dieses hier genommen:

[liv-in-sky]

o o o - ich habe durch ein anderes projekt eines dazu installiert und das falsche genommen (das hat noch einen schonen zeiger für die anzeige) - dabei war es das standard widget :rotating_light: