FTUI Neue Version chart_widget

SKg · 06 Juni 2021, 15:02:10

Zitat von: SKg am 06 Juni 2021, 10:46:24
Hallo,

ich versuche seit einer gefühlten Ewigkeit ein Kuchendiagram ans laufen zu bekommen.
Das Diagramm selbst funktioniert einwandfrei nur die Aktualisierung klappt nicht so wie ich es gerne hätte. (vielleicht verlange ich auch zu viel)
Ich habe in einen voran gegangenen Antwort gelesen das man die Zeile "data-device=" hinzufügen soll.
Leider wird das Diagramm nicht aktualisiert wenn im Log der Eintrag "2021-06-06 10:23:09 dummy Prozent_Netz_Monat 15" auftaucht.
Wenn ich die Seite neu lade werden die Werte aktualisiert.
ich würde das ganze gerne betreiben ohne die ganze Zeit die Seite neu zu laden.

Vielleicht weiß jemand eine Lösung?

MFG
Stephan

Das Problem mit dem automatischen aktualisieren ist mit einfügen der Zeile " data-prefetch="true" " behoben, allerdings gibt es jetzt ein neues Problem.
Die Grafik wirkt nach dem aktualisieren verschoben, verzerrt und irgendwie doppelt gezeichnet.
Nach einem neu-laden der Seite sieht wieder alles normal aus.

Siehe angefügte Bilder.

MFG

eki · 07 Juni 2021, 14:31:57

Prefetch macht eigentlich bei dieser Art von Chart keinen Sinn. Dass das Dein Problem mit dem Update "beseitigt" ist eher ein Zufall, fürchte ich.
Ich schau mir mal an, warum das update nicht klappt, etwas Geduld.

eki · 08 Juni 2021, 14:19:36

Angehängt ist eine neue Version, die das angesprochene Verhalten nicht mehr haben sollte. Das Update müsste eigentlich funktionieren. Falls nicht, poste mal bitte Deinen HTML header (dort wo Du die Dinge für ftui festlegst und einbindest).

SKg · 16 Juni 2021, 18:20:52

Hallo,

@eki: Sorry für die späte Antwort, ich hätte nicht so schnell mit einer Antwort gerechnet.

Jetzt funktioniert es richtig. Vielen Dank.

MFG

SKg · 16 Juni 2021, 18:32:58

Hallo,

ich bin blutiger Anfänger und daher sieht mein Header noch so aus wie aus dem FHEM Tablet UI Wiki (siehe unten).

Zitat von: eki am 08 Juni 2021, 14:19:36
Das Update müsste eigentlich funktionieren. Falls nicht, poste mal bitte Deinen HTML header (dort wo Du die Dinge für ftui festlegst und einbindest).

Über Tipps zur Verbesserung würde ich mich jederzeit freuen.

Code Auswählen


<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.5.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *-abc
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <link rel="icon" href="favicon.ico" type="image/x-icon" />

    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-green-ui.css" / -->
    <!-- link rel="stylesheet" href="css/fhem-tablet-ui-user.css" / -->

    <script src="js/fhem-tablet-ui.js" defer></script>


    <!-- Remove this line to enable for usage with WebViewControl
    <script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
    <script src="../pgm2/cordova-2.3.0.js" defer></script>
    <script src="../pgm2/webviewcontrol.js" defer></script>
    <!-- End for WebViewControl -->

    <title>Kuchendiagramm</title>
</head>

MFG

ebk · 19 September 2021, 23:14:06

Hallo eki,

vielen Dank für Deine Anpassungen am Chart Widget. Ich hatte ebenfalls das Problem, dass die Updates der Charts nach dem letzten Update nicht mehr funktioniert haben (data.runningRefresh stand scheinbar immer auf true).

Mit der von Dir geposteten letzten Version klappt es jetzt wieder. Vielen Dank dafür!

Wird diese Version dann auch ins offizielle Repository wandern?

Viele Grüße
ebk

eki · 20 September 2021, 11:53:51

Zitat
Wird diese Version dann auch ins offizielle Repository wandern?

Ja, werde ich die Tage mal an setstate weiter geben.

Andy_C · 25 September 2021, 21:02:08

Hallo Zusammen,

ich habe schon viel gesucht und auf Seite 15 schon mal eine Anfrage gefunden... aber dann erst mal nichts mehr und der ganze Thread ist schon ein wenig lang

Kann man eine Grafiklinie je nach Wert farblich ändern? In meinem Fall geht es um den CO2-Wert, aber ich würde es auf die Heizung ect. übertragen. Zum Beispiel morgens bis zu einer Temperatur 18 Grad ist die Linie blau, ab 20 Grad wird sie dann Grün und ab 26 Grad rot und wenn sie in den niedrigeren Bereich fällt, auch wieder dessen Farbe bekommt (mit einstellbaren Farben/Schwellwerten, ab wann welche Farbe verwendet wird).

viele Grüße, Andy

dirk.k · 25 September 2021, 23:33:49

Hallo,
ja, das geht.
Ich poste mal das ganze Chart. Zum heraussuchen fehlt mir gerade die Zeit. Das ist evtl. später möglich.
Die Kurve der Luftfeuchtigkeit wird blau ab ca. 70%

Code Auswählen

		<div data-type="chart"
			data-logdevice="logdb"
			data-logfile="HISTORY"
			data-device="WeMos_S1" 
			data-get="Temperatur"

			data-columnspec='["Sonoff_S20_01:relay:::$val=($val=~1?8:0)","MAX_SC_02543a:on_off_ticker:::$val=($val=~1?8:0)","MAX_TH_1a9aeb:valveposition","MAX_TH_1a9aeb:desiredTemperature","WeMos_S1:Temperatur","WeMos_S1:Luftfeuchtigkeit","WeMos_S1:PIR:::$val=($val=~1?37:0)","MAX_TH_1a9aeb:Temperatur","Sonoff_S20_01:CountDown"]'
			data-style='["ftui l6fill","ftui l5fill","ftui l3dot","ftui l2dash","ftui l0fill", ["ftui",["-2","#ffffff","1.7"],["70","#ffffff","1.7"],["70","#78DFFF","1.7"],["100","#78DFFF","1.7"]] ,"ftui l0","ftui l0fill","ftui l1fill"]'
			data-ptype='["steps","steps","steps","steps","lines","lines","points","lines","steps"]'
			data-legend='["Trockner-an","Fenster","par11","desiredTemperature","Temperatur","Luftfeuchtigkeit","Bewegung","Temperatur","TIMER"]'
			data-uaxis='["primary","primary","primary","secondary","secondary","primary","secondary","secondary","primary"]'
		 	data-graphsshown='[true,true,true,true,false,true,true,true,false]' 

			data-minvalue="0"
			data-maxvalue="90"
			data-minvalue_sec="10"
			data-maxvalue_sec="40"
			data-ytext_sec=""
			data-yticks_sec="[10,15,20,25,30,35]"
			data-xticks="auto"
			data-caption="min: $min°C - max: $max°C"
			data-width="90%"
			data-height="150"
			data-scrollgroup="1"
			data-yunit="%"
			data-yunit_sec="*C"
			data-crosshair="true"
			data-showlegend="false"
			data-prefetch="true" 
			data-yticks_prio='secondary'
			data-timeranges='[
				["Heute","0D","-1D"],
				["Gestern","1D","0D"],
				["Gestern+Heute","1D","-1D"],
				["Aktuelle Woche","0W","-1W"],
				["Aktueller Monat","0M","-1M"],
				["letzte 2 Monate","1M","-1M"],
				["Aktuelles Jahr","0Y","-1Y"],
				["letzte 2 Jahre","1Y","-1Y"]
				]' 
		>
		</div>

Es muss die Zeile "data-style" sein.

eki · 27 September 2021, 07:42:08

Beschrieben ist das übrigens im Chart Wiki (unter "Übergänge mit Datenabhängigen Grenzen").

https://wiki.fhem.de/wiki/FTUI_Widget_Chart

dirk.k · 27 September 2021, 22:58:42

Mann kann es sich natürlich auch einfach machen ...

PS: DANKE

eki · 26 Oktober 2021, 14:07:37

Da es offensichtlich einen Fehler in der Legendendarstellung gibt, wenn einzelne Graphen per data-graphsshown ausgeschaltet sind, hier eine Testversion, die das korrigiert.

Olaf · 29 Oktober 2021, 07:36:56

Vielen Dank. Jetzt wird die Legende richtig angezeigt.

dirk.k · 19 November 2021, 20:06:21

Hallo zusammen,
ich habe seit geraumer Zeit ein Problem, welches leider auch mit der aktuellsten Version noch besteht.
Ich habe gelegentlich "fehlende Graphenteile"
z.B.: Ich überwache die Verfügbarkeit meiner wichtigsten Sensoren, indem ich die Uptime-Werte logge und als Punkte im Chart darstellen lasse.
Nun kommt es (ich würde sagen immer häufiger) vor, dass die "Lebenslinien" nicht angezeigt werden.
Erst wenn ich den Graphen stauche (den Zeitrahmen deutlich vergrößere), kommen auch die vermissten Graphen wieder....
Verkleinere ich das Zeitfenster wieder, verschwindet die Anzeige wieder ... absolut nachvollziehbar.
Gibt es eine "Mindestanzahl an Datenpunkten", welche ich brauche bevor etwas angezeigt wird?
Hier mal einige Beispiele:

eki · 21 November 2021, 13:06:02

Sollte eigentlich nicht sein, zumindest beim Chart werden keine Punkte bewusst weggelassen.

Um das nachzuvollziehen, bräuchte ich ein Stück Deiner Logs und die Chart Definition.