[FHEM-Tablet-UI] Chart

[Standarduser]

Wie bekomme ich das "lw 4" nun im Chart widget definiert?

siehe meine Antwort in Deinem anderen Beitrag https://forum.fhem.de/index.php/topic,69309.0.html

Oder gern auch mal im Wiki schauen: https://wiki.fhem.de/wiki/FTUI_Widget_Chart

[Familienpapi]

Hallo, Zusammen,

ich finde chart super und würde nun gerne einen oben drauf setzen und den Bereich (data-minvalue und data-maxvalue) auf auto-1 bzw auto+1 setzen. Habe mir den Quellcode schon angeschaut und auch fleißig gegoggelt, aber keine Antwort gefunden.

Konkret geht es um diesen Chart hier:

Code Auswählen Erweitern

<div data-type="chart"
data-device="Wetter"
data-get="state"
data-logdevice='["myLogProxy"]'
data-columnspec='["Func:logProxy_proplanta2Plot(\\x22Wetter\\x22,\\x22temp_\\x22,$from,$to,12,\\x22day\\x22)"]'
data-style='["ftui l0"]'
data-ptype='["quadraticSmooth"]'
data-uaxis='["primary"]'
data-legend='["Temperatur"]'
data-yunit=" &deg;C"
data-ytext="Temperatur"
data-minvalue="auto"
data-maxvalue="auto"
data-daysago_start="0h"
data-daysago_end="-24h"
data-timeformat="hh"
data-xticks="120"
data-showlegend="false"
data-width="96%"
data-height="96px"
class="normal nobuttons">
</div>
auf Basis Proplanta wie im WiKi-Beispiel. Dieser sieht Stand heute so wie im Anhang aus.

Ich hätte gerne die hintere Spitze der Termperaturkurve optisch innerhalb meines Charts und nicht so nach oben raus. Hätte mir da jemand eine Idee?

[eki]

Ich bin mir nicht ganz sicher, aber schau mal hier
https://forum.fhem.de/index.php/topic,48450.msg536246.html#msg536246
Möglicherweise ist es das was Du möchtest.

[Familienpapi]

@eki: genau das war's. Super! Vielen Dank!

[All-Ex]

Gibt es die Möglichkeit, die Nachkommastellen der Beschriftung auf der Y-Achse zu beschränken?

Bei der Temperatur steht bei mir aktuell 10.0°C 11.0°C etc.
Der gleiche Informationsgehalt könnte übersichtlicher und mit weniger Platzbedarf auch mit 10°C 11°C etc. (also ohne Nachkommastelle) dargestellt werden...

Alex

[eki]

Aktuell lässt sich das, wenn data-yticks auf "auto" steht, nicht ändern (wird automatisch im script bestimmt und hängt von der Größe der Zahl ab). Du könntest data-yticks="1" setzen, dann wird der Abstand zwischen den Ticks immer 1 sein und die Nachkommastellen wären 0.

Ist zugegeben noch nicht optimal, ich mach mir mal Gedanken, wie man das besser machen kann.

[Max_Power]

Hi zusammen,

ich komme bei der Umstellung von FileLog nach dbLog bei FTUI und Charts Modul nicht weiter.
Vielleicht habt Ihr die InitialZündung

Ich versuche den Stromverbrauch aktuell darzustellen. Temperaturen, Zählerstand_total,... funktioniert alles. DBLog also korrekt verbunden.
DBlog liegt auf PI (SQlite).

Problem ist das der Stromverbrauch mal mit zwei Leerzeichen kommt ("  356"), mal mit einem (" 1555"). Bei einem Leerzeichen kommt SQlite damit zurecht und macht ein Leerzeichen weg. Bei zwei, nimmt es eins weg und ich habe das Gefühl Charts kommt damit nicht zurecht. Es werden nur die vierstelligen Werte geplottet.

Code Auswählen Erweitern

2017-08-25 18:24:07|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch: 2034.0|Stromverbrauch|2034.0|
2017-08-25 18:24:25|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch: 2600.0|Stromverbrauch|2600.0|
2017-08-25 18:30:28|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch:  731.0|Stromverbrauch| 731.0|
2017-08-25 18:30:59|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch: 1560.0|Stromverbrauch|1560.0|
2017-08-25 18:31:17|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch: 2600.0|Stromverbrauch|2600.0|
2017-08-25 18:32:54|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch: 1170.0|Stromverbrauch|1170.0|
2017-08-25 18:35:14|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch:  334.0|Stromverbrauch| 334.0|
2017-08-25 18:37:31|NodeMCU_Stromverbrauch|MQTT_DEVICE|Stromverbrauch:  344.0|Stromverbrauch| 344.0|


Code Auswählen Erweitern

<li data-row="1" data-col="2" data-sizex="6" data-sizey="2">
      <header>Chart</header>
        <div  data-type="chart"
              data-device="NodeMCU_Hall"
              data-logdevice="DbLog"
              data-logfile="HISTORY"
            data-columnspec='["NodeMCU_Hall:Hall","NodeMCU_Stromverbrauch:Stromverbrauch:::"]'
              data-style='["ftui l5","ftui l4fill"]'

Im FHEM wird der Stromverbrauch astrein geplottet.... Nur auf dem Tablet im Charts bei FTUI komme ich nicht weiter?

Habt Ihr Ideen? Führendes Leerzeichen via UserReading eliminieren? Oder im MQTT schon eliminieren?

VG

[eki]

Wie sieht denn deine Plotkonfiguration in FHEM aus (also das .gplot File)?

[MagicB85]

Hallo zusammen,

ich sitze jetzt seit Stunden an einem Problem und komme nicht weiter. 
Ich habe eine Log-Datei, in der ich die Benzinpreise (Super E5) von 2 Tankstellen schreibe.

Code Auswählen Erweitern


2017-10-13_16:15:34 AVIA_Kehrum SuperE5: 1.30
2017-10-13_16:15:53 REAL_Rees SuperE5: 1.29
2017-10-13_16:16:34 AVIA_Kehrum SuperE5: 1.30
2017-10-13_16:16:53 REAL_Rees SuperE5: 1.29
2017-10-13_16:17:34 AVIA_Kehrum SuperE5: 1.30
2017-10-13_16:17:53 REAL_Rees SuperE5: 1.29
2017-10-13_16:18:34 AVIA_Kehrum SuperE5: 1.30
2017-10-13_16:18:54 REAL_Rees SuperE5: 1.29
2017-10-13_16:19:34 AVIA_Kehrum SuperE5: 1.30
2017-10-13_16:19:54 REAL_Rees SuperE5: 1.29


Zuerst hatte ich nur die AVIA Tankstelle drin und es funktionierte. Deswegen denke ich, ist mein Regex soweit richtig.
Seitdem ich aber die zweite Tankstelle mitlogge, wird mir das Chart noch angezeigt, aber überhaupt kein Graph mehr.

Die Definition vom Chart sieht derzeit so aus:

Code Auswählen Erweitern


<div data-type="chart"
data-logdevice="FileLog_Spritpreise"
data-device="AVIA_Kehrum"
data-columnspec='["4:AVIA_Kehrum.SuperE5\x3a:1:","4:REAL_Rees.SuperE5\x3a:1:"]'
data-style='["ftui l0","ftui l1dot"]'
data-ptype='["lines","lines"]'
data-uaxis='["primary","primary"]'
data-yunit="€"
data-ytext="Preis/Liter"
data-legend='["AVIA Kehrum","REAL Rees"]'
data-minvalue="1"
data-maxvalue="1.6"
data-height="250"
data-yticks="auto"
data-nofulldays="true"
data-daysago_start="3h"
data-daysago_end="now"
data-cursorgroup="1"
data-scrollgroup="1"
data-xticks="auto">
</div>


Ich denke, ihr findet bestimmt die Lösung. 
Vielen Dank vorab schonmal!

[zobi]

Hallo,

ich benutze Chart und es funktioniert schon ganz gut... Außer bei folgenden Dingen

1. Titel formatieren
2. Legende

zu 1.)  folgende Zeile habe ich in dem Chart:

Code Auswählen Erweitern

data-title="Klima Wohnzimmer $data{avg1}"

Die Schriftfarbe ist schwarz und die Zahl hat gefühlt 20 Nachkommastellen, kann man da was umstellen?

zu 2.)

Code Auswählen Erweitern

data-legendpos='["left","below"]'
data-legend_horiz="true"

die Legende ist weder links/darunter (sondern oben rechts) und die auch nicht horizontal...
kann mir jemand helfen?

Hier der gesamte Code:

Code Auswählen Erweitern

<div data-type="chart"
     data-device="WZ_TH1"
data-logdevice="FileLog_WZ_TH1"

data-daysago_start="7"
data-crosshair="true"
data-title="Klima Wohnzimmer $data{avg1}"
data-showlegend="true"
data-legendpos='["left","below"]'
data-legend_horiz="true"
data-width="700"
data-columnspec='["4:measured-temp","4:desired-temp","4:actuator"]'
data-legend='["gemessen","gewünscht","Ventil"]'
data-style='["ftui l2", "ftui l0dot", "ftui l1fill"]'
data-uaxis='["primary","primary","secondary"]'
data-ytext="Temperatur"
data-yunit="°C"
data-minvalue="auto"
data-maxvalue="auto"
data-ytext_sec="Ventilöffnung"
data-yunit_sec="%"
data-minvalue_sec="0"
data-maxvalue_sec="100"

>
</div>


Viele Grüße zobi

[eki]

Hallo zusammen,

ich sitze jetzt seit Stunden an einem Problem und komme nicht weiter. 
Ich habe eine Log-Datei, in der ich die Benzinpreise (Super E5) von 2 Tankstellen schreibe.
...

In der Columnspec muss ein ":" folgendermaßen maskiert werden: \\x3a (der erste \ maskiert sorgt dafür, dass der zweite \ auch als solcher erkannt wird und nicht als Sonderzeichen.

Mit:

Code Auswählen Erweitern

data-columnspec='["4:AVIA_Kehrum.SuperE5\\x3a:1:","4:REAL_Rees.SuperE5\\x3a:1:"]'


sollte es funktionieren (in Deinem Fall würde auch ein "." statt "\\x3a" gehen.

[eki]

Hallo,

ich benutze Chart und es funktioniert schon ganz gut... Außer bei folgenden Dingen

1. Titel formatieren
2. Legende

zu 1.)  folgende Zeile habe ich in dem Chart:

Code Auswählen Erweitern

data-title="Klima Wohnzimmer $data{avg1}"

Die Schriftfarbe ist schwarz und die Zahl hat gefühlt 20 Nachkommastellen, kann man da was umstellen?

Bei den Nachkommastellen gibt es bisher keine Begrenzung. Ich werde mir etwas dazu überlegen. Was die Farbe betrifft, schau bitte mal in deinem ftui_chart.css nach was dort bei der Klasse caption steht.

zu 2.)

Code Auswählen Erweitern

data-legendpos='["left","below"]'
data-legend_horiz="true"

die Legende ist weder links/darunter (sondern oben rechts) und die auch nicht horizontal...
kann mir jemand helfen?

Hier der gesamte Code:

Code Auswählen Erweitern

<div data-type="chart"
     data-device="WZ_TH1"
data-logdevice="FileLog_WZ_TH1"

data-daysago_start="7"
data-crosshair="true"
data-title="Klima Wohnzimmer $data{avg1}"
data-showlegend="true"
data-legendpos='["left","below"]'
data-legend_horiz="true"
data-width="700"
data-columnspec='["4:measured-temp","4:desired-temp","4:actuator"]'
data-legend='["gemessen","gewünscht","Ventil"]'
data-style='["ftui l2", "ftui l0dot", "ftui l1fill"]'
data-uaxis='["primary","primary","secondary"]'
data-ytext="Temperatur"
data-yunit="°C"
data-minvalue="auto"
data-maxvalue="auto"
data-ytext_sec="Ventilöffnung"
data-yunit_sec="%"
data-minvalue_sec="0"
data-maxvalue_sec="100"

>
</div>


Viele Grüße zobi

Das mit der Legende hat bei mir mit genau Deiner Definition funktioniert (siehe Bild). Kannst Du bitte mal prüfen, ob Du die letzte Version (siehe Anfang dieses Threads) von widget_chart.js hast?

[Rheingold]

Hi,

doofe Frage: wie kann ich in einem Temperatur-Chart eine Linie an einer bestimmten Stelle/einem bestimmten Wert ziehen? Beispielsweise bei 0°C ?

[eki]

doofe Frage: wie kann ich in einem Temperatur-Chart eine Linie an einer bestimmten Stelle/einem bestimmten Wert ziehen? Beispielsweise bei 0°C ?

Das geht mit logProxy. Bitte schau Dir zu logProxy mal die Beschreibung zu "7-Tage-Wettervorhersage mit Proplanta" im Chart Wiki an (https://wiki.fhem.de/wiki/FTUI_Widget_Chart). Für die Darstellung einer Linie bei 0° C müsste die Definition etwa so aussehen (angenommen Dein logProxy Device in FHEM hast Du logProxy genannt):

Code Auswählen Erweitern


<div data-type="chart"
     data-device="WZ_TH1"
data-logdevice='["FileLog_WZ_TH1","FileLog_WZ_TH1","FileLog_WZ_TH1","logProxy"]'
data-daysago_start="7"
data-crosshair="true"
data-title="Klima Wohnzimmer $data{avg1}"
data-showlegend="true"
data-legendpos='["left","below"]'
data-legend_horiz="true"
data-width="700"
data-columnspec='["4:measured-temp","4:desired-temp","4:actuator","ConstY:0"]'
data-legend='["gemessen","gewünscht","Ventil",""]'
data-style='["ftui l2", "ftui l0dot", "ftui l1fill","ftui l1"]'
data-uaxis='["primary","primary","secondary","primary"]'
data-ytext="Temperatur"
data-yunit="°C"
data-minvalue="auto"
data-maxvalue="auto"
data-ytext_sec="Ventilöffnung"
data-yunit_sec="%"
data-minvalue_sec="0"
data-maxvalue_sec="100"
>
</div>


[moeweflieg]

Hi,

kann man data-minvalue bzw. data-maxvalue auch variabel belegen z.B. mit dem Zustand eines Device oder Readings?

Gruß
moewe