Hallo zusammen,
ich benutze das Tablet-UI zur Bereitstellung einer Benutzeroberfläche für meine Haussteuerung mit fhem. Zur Anzeige von grafischen Darstellungen benutze ich das Widget chart. Verschiedene Parameter funktionieren nicht wie erwartet und im Wiki Tablet-UI angegeben.
z.B. data-maxvalue, data-minvalue: für eine dynamische Anpassung der Darstellung kann hier ein <device>:<reading> angegeben werden. Funktioniert nicht.
Die horizontalen Hilfslinien können mit data-yticks_prio auf die primary bzw. secondary Y-Achse ausgerichtet werden. Funktioniert nicht.
Hat jemand Erfahrung hinsichtlich der Verwendung chart-Parameter ?
Hallo, da ich das Chart Widget gebaut habe, kann ich wohl am besten helfen.
Erkläre mal etwas genauer was Du machst (am besten mit einem Beispiel Deiner FTUI Konfiguration) und was Du möchtest. Mit 'funktioniert nicht' alleine kann ich leider nichts anfangen. Außerdem wäre es gut zu wissen, welche Version Du verwendest (wann hast Du das letzte Update gemacht).
Hallo,
vielen Dank erstmal für deine Antwort. Ich habe heute nochmal das letzte update gemacht entsprechend der Beschreibung im wiki Fhem-Tablet-UI.
Ich habe ein Chart in dem 2x Lufttemperatur (primary Y-Achse) und einmal die Luftfeuchtigkeit (secondary Y-Achse) dargestellt werden. Die Hilfslinien sollen an der primary Y-Achse ausgerichtet werden, was nur funktioniert, wenn im Array data-uaxis primary als letztes genannt wird. Dann werden aber die Temperaturkurven durch die Fläche Luftfeuchtigkeit verdeckt.
Die Konfiguration des Chart-Widgets ist wie folgt;
<div class="text.axes caption top-space-7"
data-type="chart"
data-device="ga_Aussenthermostat"
data-logdevice='["FileLog_ga_Aussenthermostat","FileLog_Bodenfeuchte_Sensor","FileLog_ga_Aussenthermostat"]'
data-logfile='["-","-","-"]'
data-columnspec='["4:T","4:Bodenfeuchte_Sensor_T2:temperature","6:H"]'
data-style='["ftui l2","ftui l0","ftui l5fill"]'
data-ptype='["lines","lines","lines"]'
data-uaxis='["primary","primary","secondary"]'
data-legend='["Temperatur Balkon", "Temperatur Gartenhaus","Luftfeuchtigkeit"]'
data-legendpos='["top","right"]'
data-yticks_prio="primary"
data-yunit="°C"
data-ytext="Temperatur"
data-minvalue="0"
data-maxvalue="40"
data-yticks="5"
data-yunit_sec=" %"
data-ytext_sec="Luftfeuchtigkeit"
data-minvalue_sec="0"
data-maxvalue_sec="100"
data-xticks="auto"
data-nofulldays="true"
data-daysago_start="0"
data-daysago_end="-1"
data-timeformat="hh:mm\LF\dd"
data-showlegend="false"
data-cursorgroup="1"
data-scrollgroup="1"
data-height="350px"
data-width="720px">
</div>
In einem weiteren Chart zeige ich die Bodenfeuchtigkeit im Garten an. Hier wollte ich die Skalierung der primary Y-Achse dynamisch gestalten über die Parameter data-minvalue und date-maxvalue. Ich habe ein "<device>:<reading>" als Parameter angegeben. Das device ist ein Homeatic Device, im Bereich der Readings habe ich den Max- und Min-Value definiert. Hier meine Konfiguration:
Device: Bodenfeuchte_Sensor
Readings
Activity alive 2018-09-25 10:49:41
CommandAccepted yes 2018-06-30 13:17:53
D-firmware 1.2 2018-06-29 16:14:43
D-serialNr OEQ0801395 2018-06-29 16:14:43
PairedTo 0x1FB23E 2018-06-30 13:17:53
R-burstRx off 2018-05-20 12:27:17
R-cyclicInfoMsgDis 0 2018-05-20 12:27:17
R-pairCentral 0x1FB23E 2018-05-20 12:27:17
R-paramSel T1_T2 2018-05-20 12:27:17
RegL_00. 01:00 02:01 0A:1F 0B:B2 0C:3E 11:00 18:00 1B:03 00:00 2018-06-30 13:17:53
battery ok 2018-09-25 11:19:46
chart_maxvalue 50 2018-09-23 23:54:33
chart_minvalue 0 2018-09-23 23:55:06
rssi_at_HMUART -84 2018-09-25 11:19:46
state CMDs_done 2018-06-30 13:17:57
Das Chart-Widget ist wie folgt definiert:
<div class="text.axes caption top-space-7"
data-type="chart"
data-device="Bodenfeuchte_Sensor_T1"
data-logdevice="FileLog_Bodenfeuchte_Sensor"
data-logfile="-"
data-columnspec='["4:Bodenfeuchte_Sensor_T1:temperature"]'
data-style='["ftui l5fill"]'
data-ptype='["lines"]'
data-uaxis='["primary"]'
data-legend='["Bodenfeuchtigkeit"]'
data-legendpos='["top","right"]'
data-yunit=""
data-ytext="Feuchtigkeitswert"
data-minvalue="Bodenfeuchte_Sensor:chart_minvalue"
data-maxvalue="Bodenfeuchte_Sensor:chart_maxvalue"
data-yunit_sec=""
data-ytext_sec=""
data-minvalue_sec=""
data-maxvalue_sec=""
data-xticks="auto"
data-yticks="10"
data-nofulldays="true"
data-daysago_start="0"
data-daysago_end="-1"
data-timeformat="hh:mm\LF\dd"
data-showlegend="false"
data-cursorgroup="1"
data-scrollgroup="1"
data-height="350px"
data-width="720px">
</div>
Ich hoffe ich habe dir ausreichend Info gegeben um weitere Analysen durchführen zu können.
Das funktioniert bei mir beides einwandfrei (ich habe mir dummy devices in FHEM mit Deinen Namen angelegt, und ansonsten exakt Deine Definition verwendet).
Kannst Du mal bitte schauen, welche Versionsnummer oben in der Datei widget_chart.js steht, und prüfen, ob der Pfad zu fhem_tablet_ui.js in Deinem HTML der richtige ist.
Die Datei widget_chart.js liegt im Verzeichnis /opt/fhem/www/tablet/js .In der Datei ist keine Versionsnummer angegeben. Die Datei hat eine Größe von 185,1kB und die letzte Änderung ist vom 01.11.2016 16:20 .
Die Datei fhem-tablet-ui.js ( übrigens bei mir mit - und nicht mit _ geschrieben) befindet sich im gleichen Verzeichnis wie die widget_chart.js . In der index.html wird wie folgt referenziert:
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js" defer></script>
Ich habe heute morgen noch ein update wie folgt durchgeführt. Eingabe in die Fhem Befehlszeile:
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Danach hat sich die Darstellung der Oberfläche in einigen Punkten geändert, so dass ich jetzt nacharbeiten muss und schauen muss woran es liegt.
Die widget_charts.js Datei hat jetzt einige Kommentarzeilen am Anfang und die Versionsangabe 2.7 .
Mein Chart Außentemperatur/Luftfeuchtigkeit zeigt zwar die Kurven an aber keine Achsenbeschriftung, ebenso werden alle anderen Charts ohne Achsenbeschriftung dargestellt.
Die Version müsste passen. Vielleicht versuchst Du mal für alle Werte data-minvalue(_sec), data-maxvalue(_sec) und data-yticks(_sec) jeweils zum Testen "auto" zu setzen.
Nachdem ich den upgrade durchgeführt habe funktioniert sowohl die Ausrichtung der Hilfslinien zu der gewünschten y-Achse wie auch die Angabe eines Readings bei den Attributen data_maxvalue und data_minvalue.
Also alles ok. Danke für die Unterstützung.