Keine Charts mehr

Eisix · 06 Dezember 2017, 16:36:19

Hallo,

seit dem letzten update werden keine Chart's mehr angezeigt.
Fehlermeldung ist angehängt.

Gruß
Eisix

Det20 · 06 Dezember 2017, 16:56:11

Seit dem letzten Update sieht meine Seite sogar noch aus wie Kraut+und+Rüben.

Eisix · 06 Dezember 2017, 17:32:35

Hallo,

Dann hast du wohl schon länger kein update mehr gemacht.
Ich beziehe mich auf:


fhemtabletui
List of new / modified files since last update:
UPD www/tablet/js/widget_chart.js

New entries in the CHANGED file:
FHEM Tablet UI last change:
2017-12-05
 - Merge branch 'eki1503-patch-1'

Gruß
Eisix

Det20 · 06 Dezember 2017, 19:06:54

Ne, ich meine das heutige Update. Aktualisiere eig alle 2-3 Tage.

sash.sc · 07 Dezember 2017, 20:52:05

Habe auf meinen einzelnen Seiten, ebenfalls die Probleme !!

Keine Charts mehr und Teilweise werden die Readings aus den Devices nicht mehr angezeigt.

Update von FHEM min. 1x die Woche

setstate · 07 Dezember 2017, 21:10:14

Bis eki das Problem gelöst hat, müsst ihr erst einmal die widget_chart.js aus dem Restore Ordner wiederbeleben.

Eisix · 07 Dezember 2017, 21:20:05

Habe ich schon, wollte nur Bescheid sagen das da was nicht passt

Gruß
Eisix

eki · 08 Dezember 2017, 08:27:11

Ups, sorry.

Kannst Du mir mal posten, was auf der Browser Konsole zu sehen ist. Mit der Toast Fehlermeldung kann man hier leider nicht viel anfangen.

Det20 · 08 Dezember 2017, 10:06:06

Zitat von: setstate am 07 Dezember 2017, 21:10:14
Bis eki das Problem gelöst hat, müsst ihr erst einmal die widget_chart.js aus dem Restore Ordner wiederbeleben.

Danke, läuft so erstmal wieder. "progress" lief übrigens auch nicht mehr korrekt, war total schief alles. Durch restore der Datei läuft der nun auch wieder.

Eisix · 08 Dezember 2017, 11:52:22

@eki

Code Auswählen


jquery.min.js:2 Uncaught TypeError: a.replace is not a function
    at Function.camelCase (jquery.min.js:2)
    at U.get (jquery.min.js:3)
    at r.fn.init.<anonymous> (jquery.min.js:3)
    at S (jquery.min.js:3)
    at r.fn.init.data (jquery.min.js:3)
    at HTMLDivElement.<anonymous> (widget_chart.js:4205)
    at Function.each (jquery.min.js:2)
    at r.fn.init.each (jquery.min.js:2)
    at Object.init (widget_chart.js:4159)
    at fhem-tablet-ui.js:1393
camelCase @ jquery.min.js:2
get @ jquery.min.js:3
(anonymous) @ jquery.min.js:3
S @ jquery.min.js:3
data @ jquery.min.js:3
(anonymous) @ widget_chart.js:4205
each @ jquery.min.js:2
each @ jquery.min.js:2
init @ widget_chart.js:4159
(anonymous) @ fhem-tablet-ui.js:1393
i @ jquery.min.js:2
add @ jquery.min.js:2
always @ jquery.min.js:2
(anonymous) @ fhem-tablet-ui.js:1382
i @ jquery.min.js:2
fireWith @ jquery.min.js:2
f.(anonymous function) @ jquery.min.js:2
script.onload @ fhem-tablet-ui.js:1434

eki · 08 Dezember 2017, 13:47:28

Das bringt mich leider auch nicht so sehr viel weiter. Leider kann ich das Verhalten bei mir nicht nachvollziehen (bei mir klappt das alles) und brauche deshalb ein bisschen Hilfe von Euch.
Was gut wäre, wäre eine Browser Konsolen Ausgabe, bei der vorher das Debug Flag in den Einstellungen in der html Dateil gesetzt wurde. Das geht über:

Code Auswählen

<meta name="debug" content="2"> <!-- 1=output to console;0=not output -->

Und ein paar Infos oder am besten eine Minimal konfiguration (html file) mit der ich versuchen kann das nachzuvollziehen.

eki · 08 Dezember 2017, 14:21:46

Und jetzt noch mal ein Schuss ins Blaue, bitte könnte Ihr mal diese Version versuchen ob sich da etwas ändert?

Eisix · 08 Dezember 2017, 15:02:05

schuss ins blaue hat bei mir nichts gebracht.

Eisix · 08 Dezember 2017, 15:21:40

Hier das Beispiel mit dem debug drin.
Ist das korrekt so?

Code Auswählen


<!DOCTYPE html>
<html>
<title>FHEM</title>
<head>
<meta name="debug" content="2"> <!-- 1=output to console;0=not output -->   
</head>
<body>

<header>Aquarium</header>

<div data-type="chart"
        data-logdevice='["lp","FileLog_Aquarium_Temp"]'
        data-columnspec='["ConstY:25","4:temperature"]'
        data-style='["ftui l2","ftui l0fill"]'
        data-ptype='["lines","lines"]'
        data-uaxis='["primary","primary"]'
        data-legend='["Temperatur"]'
        data-yunit="°C"
        data-minvalue="auto"
        data-maxvalue="auto"
        data-yunit_sec="°C"
        data-minvalue_sec="auto"
        data-maxvalue_sec="auto"
        data-height="200"
        data-daysago_start="5"
        data-daysago_end="0"
        data-crosshair="true"
        data-cursorgroup="1"
        data-scrollgroup="1"
        data-showlegend="false"
        data-yticks="auto"
        data-xticks="auto">
</div>
</body>
</html>

Consolen output

Code Auswählen


jquery.min.js:2 Uncaught TypeError: a.replace is not a function
    at Function.camelCase (jquery.min.js:2)
    at U.get (jquery.min.js:3)
    at r.fn.init.<anonymous> (jquery.min.js:3)
    at S (jquery.min.js:3)
    at r.fn.init.data (jquery.min.js:3)
    at HTMLDivElement.<anonymous> (widget_chart.js:4205)
    at Function.each (jquery.min.js:2)
    at r.fn.init.each (jquery.min.js:2)
    at Object.init (widget_chart.js:4159)
    at fhem-tablet-ui.js:1393
camelCase @ jquery.min.js:2
get @ jquery.min.js:3
(anonymous) @ jquery.min.js:3
S @ jquery.min.js:3
data @ jquery.min.js:3
(anonymous) @ widget_chart.js:4205
each @ jquery.min.js:2
each @ jquery.min.js:2
init @ widget_chart.js:4159
(anonymous) @ fhem-tablet-ui.js:1393
i @ jquery.min.js:2
add @ jquery.min.js:2
always @ jquery.min.js:2
(anonymous) @ fhem-tablet-ui.js:1382
i @ jquery.min.js:2
fireWith @ jquery.min.js:2
f.(anonymous function) @ jquery.min.js:2
script.onload @ fhem-tablet-ui.js:1434

eki · 08 Dezember 2017, 15:55:03

Danke für die schnelle Antwort und fürs Ausprobieren. Ist leider nicht das, was ich brauche, sorry.

Das HTML ist doch sicher nicht deine Ganze Seitendefinition, da gibt es doch sicher noch etwas übergeordnetes, irgendwo muss ja auch noch das fhem-tablet-ui.js script geladen werden. Dort sind typischerweise schon alle möglichen meta Tags und die stylesheets enthalten. Dort sollte auch das Debug Tag hin. Letzendlich muss das meta Tag im Browser sein, bevor das fhem-tablet-ui.js ausgeführt wird.

Eisix · 08 Dezember 2017, 16:11:22

Es wird dich sicher nicht freuen aber da war es bei der Ausführung auch drin.

index.html

Code Auswählen


<!DOCTYPE html>
<html>
<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.2.2
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2016 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * !!!! Evaluation version - run only in a staging enviroment !!!!
     *
     * - create a new folder named 'tablet_eval' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet_eval
     * - add 'define TABLETUIEVAL HTTPSRV ftui_eval ./www/tablet_eval Tablet-EVAL' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet_eval/
     */
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="widget_base_width" content="61">
    <meta name="widget_base_height" content="43">
    <meta name="widget_min_cols" content="13">
<meta name="longpoll_type" content="websocket">
<meta name="toast" content="1">
<meta name='longpoll_maxage' content='240'>
<meta name='web_device' content='WEB'>
<meta name="debug" content="2"> <!-- 1=output to console;0=not output -->
<!--
    <script type="text/javascript" src="js/my_scripts.js"></script>
-->

    <link rel="icon" href="favicon.ico" type="image/x-icon" />

    <meta name='gridster_disable' content='1'>
    <meta name='gridster_resize' content='0'>
    <meta name='debug' content='2'>

    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />

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

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

edit:
sogar 2 mal wie ich gerade sehe. Macht " vs ' was aus?

Eisix · 08 Dezember 2017, 16:32:44

Habs nochmal nur mit der " Variante probiert.

Habe noch ein warning gefunden

Code Auswählen


jquery.min.js:2 jQuery.Deferred exception: a.replace is not a function TypeError: a.replace is not a function
    at Function.camelCase (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:2:2632)
    at U.get (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:3:1068)
    at r.fn.init.<anonymous> (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:3:2589)
    at S (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:3:534)
    at r.fn.init.data (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:3:2539)
    at HTMLDivElement.<anonymous> (http://192.168.100.1:8083/fhem/ftui/js/widget_chart.js:4205:11)
    at Function.each (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:2:2815)
    at r.fn.init.each (http://192.168.100.1:8083/fhem/ftui/lib/jquery.min.js:2:1003)
    at Object.init (http://192.168.100.1:8083/fhem/ftui/js/widget_chart.js:4159:16)
    at http://192.168.100.1:8083/fhem/ftui/js/fhem-tablet-ui.js:1393:36 undefined
r.Deferred.exceptionHook @ jquery.min.js:2
k @ jquery.min.js:2
setTimeout (async)
(anonymous) @ jquery.min.js:2
i @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
i @ jquery.min.js:2
fireWith @ jquery.min.js:2
f.(anonymous function) @ jquery.min.js:2
i @ jquery.min.js:2
fireWith @ jquery.min.js:2
f.(anonymous function) @ jquery.min.js:2
script.onload @ fhem-tablet-ui.js:1434

OGOL · 08 Dezember 2017, 16:55:34

Gleiches verhalten wie bei Eisix auch auf meinem System.

Code Auswählen

Try to init plugin: chart
fhem-tablet-ui.js:1845:13
Function: widget_chart.init_attr > Attributes initialized with 0.29791666666666666-0.7020833333333333
fhem-tablet-ui.js:1845:13
Function: widget_chart.init > Module initialized with width: 93% height: 0
fhem-tablet-ui.js:1845:13
jQuery.Deferred exception: a.replace is not a function camelCase@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:2630
get@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:3:1066
data/<@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:3:2587
S@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:3:532
data@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:3:2539
init/<@http://192.168.100.11:8086/fhem/ftui/js/widget_chart.js:4206:18
each@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:2813
each@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:1001
init@http://192.168.100.11:8086/fhem/ftui/js/widget_chart.js:4160:2
loadPlugin/</<@http://192.168.100.11:8086/fhem/ftui/js/fhem-tablet-ui.js:1393:29
i@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:27978
fireWith@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:28749
j@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:30215
g/</k<@http://192.168.100.11:8086/fhem/ftui/lib/jquery.min.js:2:30262
 undefined
jquery.min.js:2:31515

eki · 08 Dezember 2017, 17:33:32

OK, jetzt weiß ich zumindest woran es liegt. Offensichtlich hat das chart mit der jquery version, die mit FTUI kommt (im Verzeichnis lib der FTUI distribution) Probleme. Ich habe bei mir immer die jquery Version eingebunden, die mit FHEM mitkommt (die liegt unter ../pgm2/jquery.min.js) und damit gibt es keine Probleme.
Ihr könnt mal versuchen die folgende Zeile

Code Auswählen

<script type="text/javascript" src="../pgm2/jquery.min.js"></script>
über der Zeile

Code Auswählen

<script src="js/fhem-tablet-ui.js" defer></script>
in Eure HTML einzufügen, dann sollte es wieder gehen.

Offensichtlich reagiert die jquery Version, die mit FTUI mitkommt etwas anders auf bestimmte Dinge als die, die mit FHEM mitkommt.

Ich habe das konkrete Problem jetzt mal behoben und die Lösung hier angehängt. Allerdings denke ich, dass man das Zusammenspiel mit der FTUI jquery Version noch weiter testen muss bevor man das an alle verteilen kann. Dabei dürft Ihr gerne helfen, indem Ihr die angehängte chart Version in Eurer Umgebung tested und mir meldet wenn es Probleme gibt.

OGOL · 08 Dezember 2017, 18:04:39

Jetzt ist wieder alles OK

Danke für die schnelle Reaktion und fürs Debugging

viegener · 10 Dezember 2017, 14:12:59

Kann das bei mir auch bestätigen, mit der angehängten Version laufen die tablet-Seiten wieder - hatte mich schon selber ans debuggen gemacht.

Wann kommt die Version ins update?

setstate · 10 Dezember 2017, 15:42:17

Fix ist gemerged und per update verfügbar. Vielen Dank

Eine Frage in eigener Sache habe ich noch:

Wie kann man verhindern, dass unterhalb des min-Wertes gezeichnet wird? Beim Türöffnen geht die Desired-Temp auf 7°C. Ich will aber die Skalierung nicht soweit auseinander ziehen. Sie ist jetzt 19°-24°

Code Auswählen


       <div class="normal"
         data-type="chart"
         data-device="WohnzimmerHeizung"
         data-logdevice='["FileLog_KuechenHeizung","FileLog_KuechenHeizung","FileLog_KuechenHeizung"]'
         data-columnspec='["4:ist-get","4:soll-get","4:stellgroesse-get"]'
         data-style='["ftui l0fill","ftui l2dot","ftui l2dash"]'
         data-ptype='["lines","histeps","histeps"]'
         data-uaxis='["primary","primary","secondary"]'
         data-legend='["Measured", "Desired", "Valve"]'
         data-yunit="°C"
         data-ytext="Temperature"
         data-minvalue="19"
         data-maxvalue="24"
         data-yunit_sec="%"
         data-ytext_sec="Percentage"
         data-yticks="auto"
         data-minvalue_sec="0"
         data-maxvalue_sec="100"
         data-daysago_start="0"
         data-daysago_end="-1"
         data-crosshair="true"
         data-cursorgroup="1"
         data-scrollgroup="1"
         data-height="220px"
         data-showlegend="true"
         data-xticks="auto">
    </div>

eki · 11 Dezember 2017, 10:24:27

Auch vielen Dank fürs Übernehmen.

Das mit dem Zeichnen unterhalb des min Wertes sollte eigentlich nicht passieren. Ich habe es gerade mal ausprobiert, und bin mal wieder auf ein Problem bezüglich Browser Kompatibilität gestoßen. Beim Firefox tritt es nicht auf, bei Chrome schon, bei Safari kann ich im Moment nicht schauen. Ich werde nach einer Lösung suchen $:-\$ .

eki · 12 Dezember 2017, 08:24:21

Zitat von: setstate am 10 Dezember 2017, 15:42:17
...
Wie kann man verhindern, dass unterhalb des min-Wertes gezeichnet wird? Beim Türöffnen geht die Desired-Temp auf 7°C. Ich will aber die Skalierung nicht soweit auseinander ziehen. Sie ist jetzt 19°-24°
...

Kannst Du bitte mal mit dem angehängten widget_chart.js ausprobieren, ob es das Problem löst (mache jetzt das clipping anders, das scheint dann Browser übergreifend zu funktionieren).

setstate · 12 Dezember 2017, 17:32:16

ja, perfekt. Passt jetzt auch im Safari bei mir.

christian-ruh · 19 Oktober 2018, 18:18:44

Hallo,
ich hab nun auch upgedated und seh keinen Chart mehr.
Erhalte eine Fehlermeldung.
https://imgur.com/mvRorfW
Gibt es da eine Lösung?
Fhem und TabUI sind gestern upgedated worden also alles aktuell.
Nach dem kopieren einer alten widget_chart.js (von 09.06.2017) funktioniert es erstmal wieder.
Über Infos würde ich mich freuen.

Gruß Christian

eki · 20 Oktober 2018, 00:49:37

Siehe https://forum.fhem.de/index.php/topic,91873.msg843703.html#msg843703

christian-ruh · 20 Oktober 2018, 10:47:10

Vielen Dank für die schnelle Hilfe.
Gruß Christian

christian-ruh · 20 Oktober 2018, 17:59:23

Da war ich wohl etwas schnell,
Legende und Achsen werden nun angezeigt und die Fehlermeldung ist weg.
Allerdings wird kein Graph angezeigt, der Min.- und Maxwert schon.
Nach wie vor gilt, mit widget_chart.js vom 09.06.2017 funktioniert es.
Noch eine Idee?

Gruß Christian

eki · 22 Oktober 2018, 05:16:14

Poste mal bitte Deine Chart Definition hier (html mit <div type="chart"...)

christian-ruh · 22 Oktober 2018, 20:00:38

Aktuell sieht es so aus:

Code Auswählen


                           <div    
				data-type="chart"
				data-device="STR-02"
				data-get="electricityPower"
				data-logdevice="FileLog_STR-02"
				data-logfile="CURRENT"
				data-columnspec="4:STR-02.electricityPower"
			        data-style='["ftui l3fill"]'
				data-ptype="lines"
				data-uaxis="secondary"
				data-yticks_sec="1000"
				data-legend="Power"
				data-width="1250"
				data-height="210"
				data-title="Min: $data{min1} W  |  Max: $data{max1} W  |  Letzter Wert: $data{currval1} W"
				data-yunit=" W"
				data-ytext=""
				data-minvalue_sec="0"
				data-maxvalue_sec="auto"
				data-daysago_start="now"
				data-daysago_end="now"
				data-nofulldays="true"
				data-cursorgroup="1"
				data-scrollgroup="1"
				data-showlegend="false"
				data-timeformat="hh:mm"
				data-xticks="auto">
			</div>

Danke für Deine Hilfe.

Gruß Christian

christian-ruh · 25 Oktober 2018, 17:22:01

Hallo Eki,
benötigst Du weitere Infos?
Gruß Christian

eki · 26 Oktober 2018, 16:03:43

Nee, bin nur noch nicht dazu gekommen mir das anzuschauen, melde mich aber, versprochen.

christian-ruh · 26 Oktober 2018, 18:35:43

Alles klar, vielen Dank.
Gruß Christian

eki · 29 Oktober 2018, 16:28:54

Kannst Du bitte mal mit dieser Version testen (Problem kommt daher, dass Du nur die Sekundärachse nutzt, da war im widget noch ein Fehler).

christian-ruh · 30 Oktober 2018, 21:50:56

Super, funktioniert.
Mit der neuen Datei und der Zeile

Code Auswählen

data-style='["ftui l3fill"]'

Vielen Dank Eki

Gruß Christian