Chart lädt nicht, Seite lädt nicht

Begonnen von rasti, 28 März 2016, 09:34:36

Vorheriges Thema - Nächstes Thema
Drucken
Nach unten Seiten 1 2 3 4 5 6 Alle
Benutzer-Aktionen

knopf_piano

#45
29 März 2016, 17:58:33
Hi eki,
schau mal in den Anhang
danke
zotac nano mit proxmox und ganz viel zeug drauf

ekur

#46
29 März 2016, 18:19:49 Letzte Bearbeitung: 29 März 2016, 18:24:10 von ekur
Hallo eki,

hier die Definition (im Ganzen mit der popup Definition)

Code Auswählen

<li data-row="1" data-col="2" data-sizex="2" data-sizey="2">
    <header><div data-type="label" style="font-size:14px">Heizkörper KÜCHE</div></header><br/>
        <div    class="cell inline">
        <div    data-type="range" data-device='HZK_Kueche_Clima' data-high="measured-temp"
                data-width="25" data-height="170" data-min="10" data-max="30" data-limit-low="19"
                data-limit-high="23" data-color-low="blue" data-color="green" data-color-high="red"></div>
        </div>
    <div    class="cell inline right">
        <div    data-type="label" data-device="HZK_Kueche_Clima" data-limits='[10,17,23]'
                data-colors='["blue","green","red"]'data-get="measured-temp" data-unit="%B0C%0A"
                class="cell big"></div>
        <div    data-type="select" data-device="HZK_Kueche_Clima" data-get="desired-temp" data-set="desired-temp"
                data-items='["14.0","17.0","18.0","19.0","19.5","20.0","20.5","21.0","21.5","22.0","22.5","23.0"]'
                class="large"></div>
    <div        data-type="popup"
                data-height="450px" data-width="800px" class="cell newline">
        <div    data-type="symbol"
                data-icon="fa-area-chart"
                data-background-icon="fa-square" data-off-color="#FFFFFF"></div>
        <div    class="dialog">
        <div    class="normal" data-type="chart"
                data-device="logdb"
                data-logdevice='["logdb","logdb","logdb"]'
                data-logfile='["HISTORY","HISTORY","HISTORY"]'
                data-columnspec='["HZK_Kueche:desired-temp","HZK_Kueche:actuator","HZK_Kueche:measured-temp"]'
                data-style='["ftui l2","ftui l1fill","ftui l0fill"]'
                data-ptype='["histeps","lines","histeps"]'
                data-uaxis='["primary","secondary","primary"]'
                data-legend='["Soll-Wert","Ventilstellung","Ist-Wert"]'
                data-yunit="°C" data-ytext="Temperature" data-minvalue="10" data-maxvalue="35"
                data-yunit_sec="%" data-ytext_sec="Ventilstellung (%)"
                data-height="400" data-yticks="auto" data-xticks="auto"
                data-minvalue_sec="0" data-maxvalue_sec="100"
                data-nofulldays="true" data-daysago_start="0" data-daysago_end="-1"
                class="noticks" 
                data-cursorgroup="1" data-scrollgroup="1"></div>
        <div    data-type="link" class="newline round centered"
                data-width="60" data-height="20"
                data-color="white"
                data-background-color="green"
                data-icon="fa-check"
                onclick="$('.dialog-close').trigger('click');">OK</div>
    </div></div>
    </div>
</li>


und hier noch der Meta-Teil der html

Code Auswählen

        <title>FHEM-Tablet-UI</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <meta name="widget_base_width" content="90">
        <meta name="widget_base_height" content="105">
        <meta name="mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
        <meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
        <meta http-equiv="refresh" content="600; URL=tablet_index.html">
        <meta http-equiv="expires" content="0">
        <meta http-equiv="pragma" content="no-cache">

        <link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />

        <script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
        <!-- Enable this lines for usage with WebViewControl -->
        <script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
        <script type="text/javascript" src="/fhem/pgm2/webviewcontrol.js"></script>
        <script type="text/javascript">var wvcDevices = {'00700': 'Anzeige'}; var wvcUserCssFile="/fhem/pgm2/webviewcontrol.css"</script>
         <!-- End for WebViewControl -->


Und hier auch noch ein besserer Screenshot, jetzt vom Ubunturechner mit Firefox.
FHEM 5.8 auf Intel NUC, Visualisierung TabletUI auf Lenovo Tab10, Datenlogging MySQL
CUL_HM  HM-CC-RT-DN, HM-RC, HM-LC-BL1-FM, HM-PBI-4-FM, HM-SEC-SD, HM-SEC-SCo
ZWave
OWDevice:DS1420,DS18B20 an Intel NUC

knopf_piano

#47
29 März 2016, 19:49:56 Letzte Bearbeitung: 29 März 2016, 20:12:46 von knopf_piano
aaaahhhh.
jetzt hab ich mal stumpf die "funktionierende" cfg inkl. header-def von ekur adaptiert.
Da kommt das gleiche "drittel-weggeschneide" wie bei mir raus.
Was war der Unterschied:
Code Auswählen

      div.gridster {
  zoom: 0.75;
  -moz-transform: scale(0.75);
  -moz-transform-origin: 0 0;
      }

...und das nehm ich dafür her, damit ich das webview-control auf mein 7"-Tablet skaliere.
Das ist der Hund....
wenn ich dieses style rauskommentiere ist die graph-Ausgabe i.O.

Webviewcontrol weiterhin n.i.O.

wie skaliere ich aber ohne den style auf 0.75?

Wie krieg ich das ganze auf meine Skalierung hin?
zotac nano mit proxmox und ganz viel zeug drauf

jnewton957

#48
29 März 2016, 20:21:54
Zitat von: eki am 28 März 2016, 11:28:16

Erster Versuch: Bitte testet mal mit der neuesten Version, die unter https://forum.fhem.de/index.php/topic,48450.0.html steht nachtesten, eventuell ist damit ja schon eine Verbesserung zu sehen.


Hallo,

mit dieser Version geht alles wieder bei mir (bis jetzt - habe noch nicht alle charts und Funktionen ausprobiert - aber der skriptfehler ist weg und charts werden wieder angezeigt)

Danke und Grüße

Jörg
FHEM6.2 auf Pi5
V 1.66 nanoCUL 433 (IT)
V 1.66 nanoCUL868 (HM)
sqlite3 LogDb
ELRO AB440, DECT200,  TFA30.3125, esp8266, HM, TabletUI, IR-Schreiblesekopf (Udo),tibber Pulse, Kostal Pico, cfos Wallbox, Modbus TCP

knopf_piano

#49
29 März 2016, 20:54:53
heieiei,
im Anhang jetzt das html, welches in firefox, opera und Webviewcontrol funktionieren.
die auskommentierten Charts funktionieren nicht, hab keine Ahnung, was da unterschiedlich ist...

Firefox hat das Verhatlen, dass bei Aktivieren von
Code Auswählen

     div.gridster {
  zoom: 0.75;
  -moz-transform: scale(0.75);
  -moz-transform-origin: 0 0;
      }

das untere drittel abgeschnitten wird.

die charts funktionieren nur mit "noticks" in firefox und Webviewcontrol.

puh...
zotac nano mit proxmox und ganz viel zeug drauf

volker.m

#50
30 März 2016, 07:33:29
Hallo,

neu ist das Verhalten um 00:00:00, also zum Tageswechsel. Die Zeitachse des Vortages endet um 23:00:00, ab da werden die aktuellen Daten für eine Stunde nicht mehr angezeigt. Nach Mitternacht wechselt die Zeitachse auf den neuen Tag, allerdings beginnt sie mit dem Datum des Vortages und es wird die letzte Stunde des Vortages also von 23:00:00 bis 00:00:00 angezeigt. Die Zeitachse endet dann um 23:00:00, an dieser Stelle wird das Datum des aktuellen Tages angezeigt. Bisher ist niemand darauf eingegangen, ist das so gewollt?

Volker

eki

#51
30 März 2016, 07:38:19
Zitat von: ekur am 29 März 2016, 18:19:49
Hallo eki,

hier die Definition (im Ganzen mit der popup Definition)

Code Auswählen

<li data-row="1" data-col="2" data-sizex="2" data-sizey="2">
    <header><div data-type="label" style="font-size:14px">Heizkörper KÜCHE</div></header><br/>
        <div    class="cell inline">
        <div    data-type="range" data-device='HZK_Kueche_Clima' data-high="measured-temp"
                data-width="25" data-height="170" data-min="10" data-max="30" data-limit-low="19"
                data-limit-high="23" data-color-low="blue" data-color="green" data-color-high="red"></div>
        </div>
    <div    class="cell inline right">
        <div    data-type="label" data-device="HZK_Kueche_Clima" data-limits='[10,17,23]'
                data-colors='["blue","green","red"]'data-get="measured-temp" data-unit="%B0C%0A"
                class="cell big"></div>
        <div    data-type="select" data-device="HZK_Kueche_Clima" data-get="desired-temp" data-set="desired-temp"
                data-items='["14.0","17.0","18.0","19.0","19.5","20.0","20.5","21.0","21.5","22.0","22.5","23.0"]'
                class="large"></div>
    <div        data-type="popup"
                data-height="450px" data-width="800px" class="cell newline">
        <div    data-type="symbol"
                data-icon="fa-area-chart"
                data-background-icon="fa-square" data-off-color="#FFFFFF"></div>
        <div    class="dialog">
        <div    class="normal" data-type="chart"
                data-device="logdb"
                data-logdevice='["logdb","logdb","logdb"]'
                data-logfile='["HISTORY","HISTORY","HISTORY"]'
                data-columnspec='["HZK_Kueche:desired-temp","HZK_Kueche:actuator","HZK_Kueche:measured-temp"]'
                data-style='["ftui l2","ftui l1fill","ftui l0fill"]'
                data-ptype='["histeps","lines","histeps"]'
                data-uaxis='["primary","secondary","primary"]'
                data-legend='["Soll-Wert","Ventilstellung","Ist-Wert"]'
                data-yunit="°C" data-ytext="Temperature" data-minvalue="10" data-maxvalue="35"
                data-yunit_sec="%" data-ytext_sec="Ventilstellung (%)"
                data-height="400" data-yticks="auto" data-xticks="auto"
                data-minvalue_sec="0" data-maxvalue_sec="100"
                data-nofulldays="true" data-daysago_start="0" data-daysago_end="-1"
                class="noticks" 
                data-cursorgroup="1" data-scrollgroup="1"></div>
        <div    data-type="link" class="newline round centered"
                data-width="60" data-height="20"
                data-color="white"
                data-background-color="green"
                data-icon="fa-check"
                onclick="$('.dialog-close').trigger('click');">OK</div>
    </div></div>
    </div>
</li>


und hier noch der Meta-Teil der html

Code Auswählen

        <title>FHEM-Tablet-UI</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <meta name="widget_base_width" content="90">
        <meta name="widget_base_height" content="105">
        <meta name="mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
        <meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
        <meta http-equiv="refresh" content="600; URL=tablet_index.html">
        <meta http-equiv="expires" content="0">
        <meta http-equiv="pragma" content="no-cache">

        <link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />

        <script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
        <script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
        <!-- Enable this lines for usage with WebViewControl -->
        <script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
        <script type="text/javascript" src="/fhem/pgm2/webviewcontrol.js"></script>
        <script type="text/javascript">var wvcDevices = {'00700': 'Anzeige'}; var wvcUserCssFile="/fhem/pgm2/webviewcontrol.css"</script>
         <!-- End for WebViewControl -->


Und hier auch noch ein besserer Screenshot, jetzt vom Ubunturechner mit Firefox.

Dass die ticks gezeichnet werden obwohl Du "noticks" gesetzt hast liegt wahrscheinlich daran, dass Du 2 mal class in Deiner Defnintion hast Du solltest eher die class nur ein mal setzen und darin "normal noticks" eintragen.

eki

#52
30 März 2016, 07:45:10
Zitat von: knopf_piano am 29 März 2016, 19:49:56
aaaahhhh.
jetzt hab ich mal stumpf die "funktionierende" cfg inkl. header-def von ekur adaptiert.
Da kommt das gleiche "drittel-weggeschneide" wie bei mir raus.
Was war der Unterschied:
Code Auswählen

      div.gridster {
  zoom: 0.75;
  -moz-transform: scale(0.75);
  -moz-transform-origin: 0 0;
      }

...und das nehm ich dafür her, damit ich das webview-control auf mein 7"-Tablet skaliere.
Das ist der Hund....
wenn ich dieses style rauskommentiere ist die graph-Ausgabe i.O.

Webviewcontrol weiterhin n.i.O.

wie skaliere ich aber ohne den style auf 0.75?

Wie krieg ich das ganze auf meine Skalierung hin?

Was meinst Du denn genau mit "skalieren"? Du kannst doch die größe des Charts mit data-width und data-height festlegen und wenn Du als class anstatt "normal" "small" verwendest werden die texte klein gemacht (kann man natürlich auch explizit im css einstellen.
Das mit dem Skalieren ist eher kritisch, weil da nach meiner Erfahrung die Browser sehr unterschiedich reagieren (z.B. im Zusammenhang mit SVGs und den eh schon eingesetzten skalierungen im Chart selbst).

eki

#53
30 März 2016, 07:47:17
Zitat von: volker.m am 30 März 2016, 07:33:29
Hallo,

neu ist das Verhalten um 00:00:00, also zum Tageswechsel. Die Zeitachse des Vortages endet um 23:00:00, ab da werden die aktuellen Daten für eine Stunde nicht mehr angezeigt. Nach Mitternacht wechselt die Zeitachse auf den neuen Tag, allerdings beginnt sie mit dem Datum des Vortages und es wird die letzte Stunde des Vortages also von 23:00:00 bis 00:00:00 angezeigt. Die Zeitachse endet dann um 23:00:00, an dieser Stelle wird das Datum des aktuellen Tages angezeigt. Bisher ist niemand darauf eingegangen, ist das so gewollt?

Volker

Nein, das ist nicht so gewollt (liegt an der Sommerzeit, die ich falsch berücksichtigt habe). Es gibt bei mir schon eine Korrektur, wird demnächst verfügbar sein.

knopf_piano

#54
30 März 2016, 08:37:10
Zitat von: eki am 30 März 2016, 07:45:10
Was meinst Du denn genau mit "skalieren"? Du kannst doch die größe des Charts mit data-width und data-height festlegen und wenn Du als class anstatt "normal" "small" verwendest werden die texte klein gemacht (kann man natürlich auch explizit im css einstellen.
Das mit dem Skalieren ist eher kritisch, weil da nach meiner Erfahrung die Browser sehr unterschiedich reagieren (z.B. im Zusammenhang mit SVGs und den eh schon eingesetzten skalierungen im Chart selbst).

ich skaliere nicht das chart, sondern die gesamte html-page mit der style-Angabe, damit das in mein 7"-Tablet reinpasst.
Code Auswählen

     div.gridster {
  zoom: 0.75;
  -moz-transform: scale(0.75);
  -moz-transform-origin: 0 0;
      }


Jetzt hab ich noch gemerkt, dass die viewport-Angabe für webviewcontrol nicht greift, die funzt im z.B. fully-Browser.
Jetzt überleg ich, ob ich darauf aufsetze. Dann wär's ok.
Dazu brauch ich aber AMAD, weil ich bei Klingel-Betätigung den webview-control die url meines Web-cam-streams aufrufe, um zu sehen, wer an der Tür klingelt. D.h.... wieder was zu tun.
zotac nano mit proxmox und ganz viel zeug drauf

eki

#55
30 März 2016, 10:16:27
Zitat von: knopf_piano am 29 März 2016, 20:54:53

die charts funktionieren nur mit "noticks" in firefox und Webviewcontrol.

puh...

Kannst Du mal mit der angehängten Version testen ob das "noticks" Problem beseitigt ist?

ekur

#56
30 März 2016, 11:09:58
Zitat von: knopf_piano am 29 März 2016, 19:49:56

...und das nehm ich dafür her, damit ich das webview-control auf mein 7"-Tablet skaliere.

wie skaliere ich aber ohne den style auf 0.75?

Wie krieg ich das ganze auf meine Skalierung hin?

Mit den

Code Auswählen

        <meta name="widget_base_width" content="90">
        <meta name="widget_base_height" content="105">


sowie webview im Vollbild bekomme ich auf meinem 7" Tablet genau 10 Gridster in der Breite und 5 in der Höhe unter.
(Tablet: Samsung Tab 2 mit Cyanogenmod mit aktiviertem Ausblenden der Android Tasten.)

Ich habe festgestellt dass es für mich im Endeffekt einfacher war mit den Gridster Werten zu arbeiten und für das Tablet eigene HTML Seiten zu verwenden wie mit den Skalierungssachen zu spielen. Zumal ich auf meinem Rechner oder größerem Tablet andere widgets verwenden kann wie auf dem 7 Zoll (Thermostat ist hier ein gutes Beispiel: um auf einem 7 Zoll mit dicken Fingern sinnvoll bedient zu werden muss das Ding so groß skaliert werden dass gerade mal drei auf eine Seite passen)

FHEM 5.8 auf Intel NUC, Visualisierung TabletUI auf Lenovo Tab10, Datenlogging MySQL
CUL_HM  HM-CC-RT-DN, HM-RC, HM-LC-BL1-FM, HM-PBI-4-FM, HM-SEC-SD, HM-SEC-SCo
ZWave
OWDevice:DS1420,DS18B20 an Intel NUC

rasti

#57
30 März 2016, 19:21:41 Letzte Bearbeitung: 30 März 2016, 19:26:44 von rasti
Hallo,

kann es sein, dass das Chart Widget nun irgendwelche besonderen Anforderungen an den Browser stellt,
die es vorher nicht hatte ?

Ich kriege es nun mit geänderten Einstellungen der Chart-Widget-Parametereinstellungen
und den neuen css/js aus https://forum.fhem.de/index.php/topic,48450.0.html
so hin, dass es unter Windows / Firefox und Android Chrome/Opera wieder ordentlich aussieht.

Aber andere Android-Browser (ich habe Boat/Dolphin/Maxthon probiert) zeigen gar keine Charts mehr an,
aber das ging vor-vorgestern noch einwandfrei...

Gruß

Ralf

knopf_piano

#58
30 März 2016, 19:39:23 Letzte Bearbeitung: 30 März 2016, 20:07:37 von knopf_piano
Zitat von: eki am 30 März 2016, 10:16:27
Kannst Du mal mit der angehängten Version testen ob das "noticks" Problem beseitigt ist?
der geht! :) in ff/opera
aber weder in webviewcontrol, noch fully
zotac nano mit proxmox und ganz viel zeug drauf

knopf_piano

#59
30 März 2016, 20:24:19
Zitat von: knopf_piano am 30 März 2016, 19:39:23
der geht! :) in ff/opera
aber weder in webviewcontrol, noch fully

hab noch gemerkt, wenn ich data-yticks="auto" stelle, hab ich in wvc auch das problem, dass nix angezeigt wird.
muss jetzt zeitlich hier abbrechen, aber trotzdem danke für den support hier...
zotac nano mit proxmox und ganz viel zeug drauf
Drucken
Nach oben Seiten 1 2 3 4 5 6 Alle
Benutzer-Aktionen