hallo liebe Gemeinde,
ich verzweifle gerade an einem vermutlich recht einfachen Problem - die Darstellung der Lade/Entlade-Leistung in einer Kurve relativ zur Nulllinie.
Die (positiven) Werte oberhalb der Nulllinie sollen z.B. rot gefüllt werden, die negativen blau.
Was funktioniert:
Analog zu https://forum.fhem.de/index.php?topic=133372.0 #2 eine Nulllinie anlegen und eine gefüllte Kurve darüber legen.
<Header>Speicher</header>
<div data-type="chart"
data-device='mqtt_Solix'
data-get='R15_energy_daily_home'
data-logdevice='[
"R15_LogProxy",
"log_Solar_Power"
]'
data-logfile="CURRENT"
data-columnspec='[
"ConstY:0",
"4:mqtt_Solix.R15_power_charge"
]'
data-style='[
"ftui l5dash",
"ftui l2fill"
]'
data-ptype='["lines","lines:0"]'
data-uaxis='primary'
data-legend='[
"",
"Akku-Ladung"
]'
data-showlegend='true'
data-minvalue='-1000'
data-maxvalue='1000'
data-yticks='500'
data-yunit='W'
data-ytext='Ladeleistung'
data-legendpos='["95%","20%"]'
data-scrollgroup="1"
data-cursorgroup="1"
data-width='95%'
data-height='95%'
class="nobuttons">
</div>
Abgesehen von der fehlenden 2-Farbigkeit hat das Diagramm noch das Problem, dass die Kurve jenseits von 'now' bis zum Ende das Tags extrapoliert wird, von der Darstellung her keine Sinn macht (siehe Screenshot 1).
Was nun aber überhaupt nicht funktioniert, ist das ganze 2-farbig zu bekommen.
Nach der Beschreibung im Wiki sollte sowas funktionieren:
data-style='["fill",["-20","#0000ff","0.7"],["0","#0000ff","0.7"],["0","#ff0000","0.7"],["50","#ff0000","0.7"]]'
In meinem Fall, erst mal ganz einfach ohne die Nulllinie:
<div data-type="chart"
data-device='mqtt_Solix'
data-get='R15_energy_daily_home'
data-logdevice='[
"log_Solar_Power"
]'
data-logfile="CURRENT"
data-columnspec='[
"4:mqtt_Solix.R15_power_charge"
]'
data-style='["fill",["-1000","#0000ff","0.7"],["0","#0000ff","0.7"],["0","#ff0000","0.7"],["1000","#ff0000","0.7"]]'
data-ptype='["lines"]'
data-uaxis='primary'
data-legend='[
"Akku-Ladung"
]'
data-showlegend='true'
data-minvalue='-1000'
data-maxvalue='1000'
data-yticks='500'
data-yunit='W'
data-ytext='Ladeleistung'
data-legendpos='["95%","20%"]'
data-scrollgroup="1"
data-cursorgroup="1"
data-width='95%'
data-height='95%'
class="nobuttons">
</div>
- das liefert nur ein schwarzes Diagramm (siehe Screenshot 2), was auch immer ich versuche.
Was mache ich falsch?
(ich verwende das chart widget das eki in post #18 von https://forum.fhem.de/index.php?topic=128863.0 angehängt hat - kann das das Problem sein?)
viele Grüße -
Karsten
hmmm... ist die Frage zu dumm, zu trivial, oder gibt's keine Antwort?
bin gespannt.. ;)
Sorry hab's gerade erst gesehen, habe aktuell nur begrenzt Zugriff auf's Internet.
Ich kann aktuell nur mutmaßen, da ich nichts debuggen kann. Das einzige was mir auffällt, ist, dass Du bei den anderen Einstellungen mit Arrays arbeitest (wahrscheinlich als Vorbereitung für später mehrere Graphen), beim Style aber nicht (das ist zwar auch ein Array aber nur deshalb, weil es Übergänge haben soll).
Probier mal:
data-style='[["fill",["-1000","#0000ff","0.7"],["0","#0000ff","0.7"],["0","#ff0000","0.7"],["1000","#ff0000","0.7"]]]'
Danke! Einen Schritt weiter..
mit der data-style Zeile als Array klappt die zweifarbige Darstellung.
Screenshot 2024-09-06 at 19-15-18 HF R15 FTUI.png
Die Definition sieht dann also so aus:
<div data-type="chart"
data-device='mqtt_Solix'
data-get='R15_energy_daily_home'
data-logdevice='["R15_LogProxy"]'
data-logfile="CURRENT"
data-columnspec='[
"ConstY:0",
"FileLog:log_Solar_Power:4:mqtt_Solix.R15_power_charge"
]'
data-style='[
"ftui l5dash",
["fill",["-1000","#0000ff","0.7"],["0","#0000ff","0.7"],["0","#ff0000","0.7"],["1000","#ff0000","0.7"]]
]'
data-ptype='[
"lines",
"lines"
]'
data-uaxis='primary'
data-legend='[
"-",
"Akku-Ladung"
]'
data-showlegend='true'
data-minvalue='-1000'
data-maxvalue='1000'
data-yticks='500'
data-yunit='W'
data-ytext='Ladeleistung'
data-legendpos='["95%","20%"]'
data-scrollgroup="1"
data-cursorgroup="1"
data-width='95%'
data-height='95%'
class="nobuttons">
</div>
Jetzt noch das Diagramm an die Null-Linie hängen durch Änderung des ptype:
data-ptype='[
"lines",
"lines:0"
]'
- und schon geht nichts mehr: es kommt diese popup-Fehlermeldung...
Screenshot 2024-09-06 at 19-14-27 HF R15 FTUI.png
Kannst Du mal folgendes versuchen:
im widget_chart.js (steht im js Verzeichnis) folgende Änderung machen:
style.search(/fill/)>=0))
durch
style[0].search(/fill/)>=0))
ersetzen.