[FTUI 3] Charts

[M.Piet]

Ich stelle die funktionierende FTUI2 Zeile und die nicht nichtig funktionierenden FTUI3 Zeile untereinander:

Code Auswählen Erweitern

HMW_IO_12_Sw14_DR_NEQ0308160_01::$val=($val=~'on'?1:0)"
HMW_IO_12_Sw14_DR_NEQ0308160_01::$fld[2]=~\\x22on\\x22?0:1"
Ich muss aber zugeben, dass dies nicht grad mein Fachgebiet ist 

[Eisix]

schon mal so probiert?

Code Auswählen Erweitern

HMW_IO_12_Sw14_DR_NEQ0308160_01::$val=($val=~\\x22on\\x22?1:0)"
Ist auch nicht mein Fachgebiet

[M.Piet]

Hatte ich auch schon probiert   

Ich hoffe das jemand über den Post stolpert, der weiß wie man es löst. Aber vielen Dank für deine Hilfe!

[M.Piet]

Noch eine Frage:
Welche Werte sind denn für unit="xxx" möglich?
Bei github steht nur das Default (day), nicht aber welche Werte alle möglich sind.

Habe ich das überlesen?

[mr_petz]

@M.Piet

Es sollte wie bei:

Code Auswählen Erweitern

units="day, week, 24h, 30d, month, year, hour"
auch bei unit gehen.

LG

[hapege]

Hallo,

ich experimentiere schon eine Weile mit ftui3, ziemlich cool
Aber ich verstehe einen Punkt bei den charts, genauer bei "spec=..." nicht. Kann es sein, dass der Name des Readings nicht "exakt" genommen wird sondern im Sinne von "enthält"?
Folgende Situation:
Mein Log enthält Daten der Form

Code Auswählen Erweitern

2023-06-01_00:02:41 Delock01 ENERGY_Power: 0
2023-06-01_00:02:41 Delock01 ENERGY_Power_max_day: 622.0
Im Chart will ich "ENERGY_Power" über den Tagesverlauf darstellen (Solarertrag Balkonkraftwerk ).
Die spec in der chart-data sieht so aus:

Code Auswählen Erweitern

<ftui-chart class="row" width="300px" height="200px" unit="day">
  <ftui-chart-data
    fill
    log="FileLog_Delock01"
    spec="4:Delock01.ENERGY_Power::"
    [update]="Delock01:state:time">
  </ftui-chart-data>
 
Leider werden für das chart nicht nur die Werte für "ENERGY_Power" genommen, sondern alle die mit "ENERGY_Power" beginnen - also sehe ich im chart auch die Werte für "ENERGY_Power_max_day".
Was mache ich falsch?
(Sorry wenns schon irgendwoe steht, ich habs nirgends gefunden...)

Danke Euch!

[mr_petz]

Hi @hapege.
Könntest mal die 2 letzten Doppelpunkte im spec raus nehmen und testen.
LG

[hapege]

Hi,
Habe ich schon probiert, ändert nix

[mr_petz]

Ok.
Vielleicht hilft dir das weiter:

https://forum.fhem.de/index.php?topic=117779.msg1214814#msg1214814

Vielleicht eine Leerstelle nach Delock01.ENERGY_Power einfügen?
LG

[teichtaucher]

Ich habe auch das Problem dass ich bei einem Säulendiagramm die Säulen nebeneinander dargestellt haben möchte und habe auch schon eine Lösung gefunden: Man muss bei den einzelnen charts (also im ftui-chart-data) unterschiedliche stacks festlegen. So sieht das bei mir aus:

Code Auswählen Erweitern

              <ftui-chart title="Tageserträge" y-unit=" kWh" unit="30d" stacked-x>
                <ftui-chart-data type="bar" fill log="gl.fl.Strom" spec="4:gl.dl.Strom.Tagesertrag"
                  [update]="gl.dl.Strom:Tagesertrag" stack="stack1"></ftui-chart-data>
                <ftui-chart-data type="bar" fill log="gl.fl.Strom" spec="4:gl.dl.Strom.Netzbezug"
                  [update]="gl.dl.Strom:Netzbezug" color="red" stack="stack2"></ftui-chart-data>
                <ftui-chart-data type="bar" fill log="gl.fl.Strom" spec="4:gl.dl.Strom.Einspeisung"
                  [update]="gl.dl.Strom:Einspeisung"></ftui-chart-data>
                <ftui-chart-controls units="day,week,30d, year" color="white" stack="stack3"></ftui-chart-controls>
              </ftui-chart>

Allerdings habe ich hier auch das gleiche Problem (wie bei den Liniencharts auch) dass die Zuordnung vom Datum nicht passt. Beim Mouse Hover passen die Werte nicht zu den Säulenhöhen.

[teichtaucher]

Ich muss mir selbst antworten. Offensichtlich hat chart.js beim Tooltip (also dieser Hover Frame mit den Werten) ein Problem wenn bei den Datensätzen etwas durcheinander ist. Die Chart Darstellung läuft und die Charts der unterschiedlichen Datenreihen stehen aufeinander. Aber die genau Wertdarstellung läuft nicht. Man kann das aber ändern, steht hier beschrieben: https://www.chartjs.org/docs/latest/configuration/interactions.html#modes

Ich habe jetzt mal direkt im chart.component.js geändert und diese Zeilen vor "scales"eingefügt:

Code Auswählen Erweitern

interaction: {
mode: 'nearest'
},

Mit dem mode nearest wird nur der Wert des gehoverten charts angezeigt und nicht mehr die anderen Werte. Zumindest sehe ich so genau den Wert an dem ich mit dem Cursor über den Chart fahre. Ich suche nur ein Möglichkeit, dies direkt im HTML zu machen, damit ich chart.component.js so lassen kann und update-sicher bin. Wenn einer eine Idee hat wie das geht bitte melden. Ansonsten suche ich jetzt mal weiter.

[Eisix]

@hapege

probier mal so

Code Auswählen Erweitern

spec="4:Delock01:ENERGY_Power"

Gruß
Eisix

[mr_petz]

Ich muss mir selbst antworten. Offensichtlich hat chart.js beim Tooltip (also dieser Hover Frame mit den Werten) ein Problem wenn bei den Datensätzen etwas durcheinander ist. Die Chart Darstellung läuft und die Charts der unterschiedlichen Datenreihen stehen aufeinander. Aber die genau Wertdarstellung läuft nicht. Man kann das aber ändern, steht hier beschrieben: https://www.chartjs.org/docs/latest/configuration/interactions.html#modes

Ich habe jetzt mal direkt im chart.component.js geändert und diese Zeilen vor "scales"eingefügt:

Code Auswählen Erweitern

interaction: {
mode: 'nearest'
},

Mit dem mode nearest wird nur der Wert des gehoverten charts angezeigt und nicht mehr die anderen Werte. Zumindest sehe ich so genau den Wert an dem ich mit dem Cursor über den Chart fahre. Ich suche nur ein Möglichkeit, dies direkt im HTML zu machen, damit ich chart.component.js so lassen kann und update-sicher bin. Wenn einer eine Idee hat wie das geht bitte melden. Ansonsten suche ich jetzt mal weiter.

Hinweis.
Die aktuell benutzte Version ist die v3.0.2
Also wäre das der richtige Verweis:
https://www.chartjs.org/docs/3.0.2/configuration/interactions.html#modes

LG

[mr_petz]

@hapege

...
Aber ich verstehe einen Punkt bei den charts, genauer bei "spec=..." nicht. Kann es sein, dass der Name des Readings nicht "exakt" genommen wird sondern im Sinne von "enthält"?
...

Habe es mal nachgestellt und du hast Recht mit deiner Vermutung.
Da es ein regexp Ausdruck ist, funktioniert das im spec:

Code Auswählen Erweitern

spec="4:Delock01.ENERGY_Power\b"
Mit \b sagt man Ende des Wortes. Ansonsten nimmt er alles was in deinem Beispiel -> ENERGY_Power beinhaltet..

LG mr_petz

Edit:
Info von @setstate zu spec:

Diese Funktion bietet FHEM beim Log-abrufen out of the box.

die Spec-Angabe ist so aufgebaut: Column:Regexp:DefaultValue:Function

Code Auswählen Erweitern

log="FileLog_WCLuefter" spec="4:WCLuefter.status-get:0:$fld[3]=~'on'?1:0"...

[mr_petz]

Hatte ich auch schon probiert   

Ich hoffe das jemand über den Post stolpert, der weiß wie man es löst. Aber vielen Dank für deine Hilfe!

Gerade nachgestellt und getestet. Es läuft bei mir so:

Code Auswählen Erweitern

HMW_IO_12_Sw14_DR_NEQ0308160_01::$fld[3]=~'on'?1:0"


@Eisix

$fld[3] heißt in dem Fall lt. Wiki $val

LG