im wiki unter dem Abschnitt:
Übergänge mit datenabhängigen Grenzen
gibt es dieses Beispiel:
data-style='["fill",["-20","#0000ff","0.7"],["0","#0000ff","0"],["0","#ff0000","0"],["302","#ff0000","0.7"]]'
leider ohne Funktion, der gezeichnete Chart ist nur schwarz!
Bitte poste mal die Komplette Definition, dann kann ich das besser nachvollziehen.
gerne doch:
<div data-type="chart"
data-device="Status_Pufferspeicher_Verbrauch"
date-get="Status_Pufferspeicher_Verbrauch"
data-logdevice="logdb"
data-logfile="HISTORY"
data-columnspec="Status_Pufferspeicher_Verbrauch:kiloWatt"
data-uaxis="primary"
data-style='["fill",["-20","#0000ff","0.7"],["0","#0000ff","0"],["0","#ff0000","0"],["20","#ff0000","0.7"]]'
data-yunit="kW/h"
data-minvalue="-10"
data-maxvalue="10"
data-title="Wärmeverbrauch"
class="fullsize">
</div>
Zitat von: eki am 15 August 2018, 16:04:41
Bitte poste mal die Komplette Definition, dann kann ich das besser nachvollziehen.
und hast du das rekonstruieren können?
Nein, wird leider noch etwas dauern, bin zur Zeit unterwegs.
na kein Thema, solange bleibt der Graph eben schwarz ;D
Kann ich leider nicht nachvollziehen, bei mir wird ein Beispielgraph mit Deiner Stildefinition richtig dargestellt (siehe Anhang). Welche Version von FTUI und Chart verwendest Du denn?
Zitat von: eki am 10 September 2018, 16:26:19
Kann ich leider nicht nachvollziehen, bei mir wird ein Beispielgraph mit Deiner Stildefinition richtig dargestellt (siehe Anhang). Welche Version von FTUI und Chart verwendest Du denn?
in der widget_chart.js steht 2.7 und in der fhem-tablet-ui.js 2.7.2
ein Datensatz aus der mySQL Datenbank sieht so aus:
# TIMESTAMP, DEVICE, TYPE, EVENT, READING, VALUE, UNIT
'2018-07-21 22:04:48', 'Status_Pufferspeicher_Verbrauch', 'MQTT_DEVICE', 'kiloWatt: 0.12', 'kiloWatt', '0.12', ''
auch nach dem letzten update hat sich nichts geändert. gibt es eine Möglichkeit dem Fehler näher auf die Spur zu kommen? kann ich einen debug modus aktivieren oder verbose höher setzen?
Eine Möglichkeit wäre folgendes (Beschreibung entspricht Firefox, sollte aber bei anderen Browsern so ähnlich klappen):
Lade Deine Seite. Wenn alles aufgebaut ist, öffne die Browser Console (rechte Maustaste und dann "Element untersuchen" oder "Inspect element" auswählen). Im Reiter "Inspector" ganz oben <html> auswählen, dann wieder die rechte Maustaste und "HTML bearbeiten" auswählen. Im jetzt erscheinenden Fenster alles auswählen, und hier posten (eventuell noch Inhalte, die Du nicht weiter geben willst herauslöschen).
<div data-type="chart" data-device="Status_Pufferspeicher_Verbrauch" date-get="Status_Pufferspeicher_Verbrauch" data-logdevice="logdb" data-logfile="HISTORY" data-columnspec="Status_Pufferspeicher_Verbrauch:kiloWatt" data-uaxis="primary" data-style="["fill",["-20","#0000ff","0.7"],["0","#0000ff","0"],["0","#ff0000","0"],["302","#ff0000","0.7"]]" data-yunit="kW/h" data-minvalue="-10" data-maxvalue="10" data-title="Wärmeverbrauch" class="fullsize" style="position: relative;">
<object style="display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;" type="text/html" data="about:blank"></object><svg class="basesvg1" style="overflow: visible; width: 93%; height: 294.058px;"><text style="white-space: pre;" class="caption" x="50%" y="15px" text-anchor="middle">Wärmeverbrauch </text><g id="classesContainer" stroke="grey"></g><svg class="legend" x="0px" width="740.267px" height="294.05px" y="0px"><text class="caption inactive" x="49%" y="29" dy="0.4em" style="text-anchor:end">Legend</text><text class="caption inactive" x="51%" y="29" dy="0.4em" text-anchor="begin">Cursor</text></svg><g class="buttons"><text class="buttons" x="48px" y="29px" dy="0.4em" text-anchor="middle" style="" onclick="widget_chart.scaleTime(evt, $("svg.basesvg1").parent(), 0.5)"></text><text class="buttons" x="84px" y="29px" dy="0.4em" text-anchor="middle" style=""></text><text class="buttons" x="12px" y="29px" dy="0.4em" text-anchor="middle" style=""></text><text class="buttons" x="728.267px" y="29px" dy="0.4em" text-anchor="middle" style=""></text></g><g id="baseforDDD" style="overflow: inherit; -moz-transform: translate(0px, 0px) scale(1, 1)"><rect class="chart-background" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx;fill: url(#gr_bgftui)" height="232.05px" y="45px"></rect><g class="chart-gridlines" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx" height="232.05px" y="45px"><g class="gridlines" stroke="rgb(238, 238, 238)"><line class="xticks" x1="683.9498782051282px" y1="277.05px" x2="683.9498782051282px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="627.6327564102564px" y1="277.05px" x2="627.6327564102564px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="571.3156346153846px" y1="277.05px" x2="571.3156346153846px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="514.9985128205128px" y1="277.05px" x2="514.9985128205128px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="458.68139102564106px" y1="277.05px" x2="458.68139102564106px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="402.36426923076925px" y1="277.05px" x2="402.36426923076925px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="346.04714743589744px" y1="277.05px" x2="346.04714743589744px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="289.73002564102563px" y1="277.05px" x2="289.73002564102563px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="233.41290384615385px" y1="277.05px" x2="233.41290384615385px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="177.09578205128204px" y1="277.05px" x2="177.09578205128204px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="xticks" x1="120.77866025641025px" y1="277.05px" x2="120.77866025641025px" y2="45px" style="stroke-width:1px; stroke-dasharray:1px,2px"></line><line class="yticks primary-0" x1="64.46153846153845px" y1="68.20500000000003px" x2="740.267px" y2="68.20500000000003px" style="stroke-width: 1px; display: inline;"></line><line class="yticks primary-0" x1="64.46153846153845px" y1="114.61500000000001px" x2="740.267px" y2="114.61500000000001px" style="stroke-width: 1px; display: inline;"></line><line class="yticks primary-0" x1="64.46153846153845px" y1="161.025px" x2="740.267px" y2="161.025px" style="stroke-width: 1px; display: inline;"></line><line class="yticks primary-0" x1="64.46153846153845px" y1="207.435px" x2="740.267px" y2="207.435px" style="stroke-width: 1px; display: inline;"></line><line class="yticks primary-0" x1="64.46153846153845px" y1="253.84500000000003px" x2="740.267px" y2="253.84500000000003px" style="stroke-width: 1px; display: inline;"></line><line class="xaxis" x1="64.46153846153845px" y1="278.05px" x2="740.267px" y2="278.05px" style="stroke-width:0.9999999999999998px; stroke-dasharray:undefined"></line><line class="yaxis primary-0" x1="65.46153846153845px" y1="45px" x2="65.46153846153845px" y2="277.05px" style="stroke-width: 1px; display: inline;"></line></g></g><g class="chart-left-gridlines" x="0px" y="0px" width="675.8054615384616px" preserveAspectRatio="none" style="overflow:inherit; -moz-transform:scale(1,1) translate(0px,0px)"></g><g class="chart-bottom-gridlines" x="0px" y="0px" width="675.8054615384616px" preserveAspectRatio="none" style="overflow:inherit; -moz-transform:scale(1,1) translate(0px,0px)"></g><svg class="chart-primsec" style="clip-path: url(#clipingRect1); overflow: inherit;"><defs><clipPath id="clipingRect1"><rect x="64.46153846153845" y="45" width="675.8054615384616" height="232.04998779296875"></rect></clipPath></defs><g class="chart-parent" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none"><g class="graph-parent" style="transform: translate(0,0) scale(1,1);"><polyline points=""></polyline><path d=""></path></g></g><g class="chart-parent" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" ai="0" height="232.05px" y="45px" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><g class="graph-parent" style="transform: translate(0,0) scale(1,1);"><polyline points=""></polyline><path d="M66.33877585470084,154.5276 L 66.33877585470084,154.5276 71.03186933760684,153.71542499999998 78.07150956196581,153.36735 85.11114978632477,152.6712 92.15079001068375,151.97505 94.49733675213675,149.770575 102.00628632478632,149.19045000000003 109.04592654914529,147.914175 116.08556677350427,148.378275 123.12520699786324,148.378275 130.16484722222222,148.378275 137.2044874465812,148.14622500000002 144.24412767094017,148.4943 151.28376789529915,146.753925 158.32340811965813,147.10200000000003 165.3630483440171,147.33405000000002 172.40268856837605,146.40585000000002 179.44232879273505,144.7815 186.481969017094,145.59367500000002 193.52160924145298,145.361625 200.56124946581198,146.52187500000002 207.60088969017093,146.52187500000002 214.6405299145299,146.52187500000002 221.6801701388889,145.7097 228.71981036324786,144.897525 235.75945058760684,144.897525 242.7990908119658,144.7815 249.83873103632482,144.7815 255.47044321581197,143.27317499999998 259.69422735042735,137.47192500000003 264.3873208333333,140.37255000000002 269.0804143162393,143.38920000000002 276.1200545405983,145.129575 278.9359106303419,146.289825 285.9755508547008,146.86995 293.01519107905983,147.5661 300.05483130341884,146.17380000000003 307.0944715277778,146.985975 314.1341117521368,147.68212499999998 321.17375197649574,148.03020000000004 328.21339220085474,148.14622500000002 331.0292482905983,135.9636 335.7223417735043,138.63217500000002 342.76198199786324,139.90845000000002 349.80162222222225,140.14049999999997 356.84126244658125,140.83665 359.18780918803424,141.648825 366.2274494123932,142.11292500000002 368.57399615384617,145.7097 373.73639898504274,154.99169999999998 377.96018311965815,168.68265000000002 382.6532766025641,177.848625 387.34637008547014,188.40690000000004 392.0394635683761,196.06455000000003 396.7325570512821,187.47870000000003 401.42565053418804,193.163925 408.465290758547,192.467775 409.4039094551282,161.025 416.4435496794872,161.025 418.7900964209402,168.21855 426.29904599358974,169.61085000000003 428.6455927350427,175.52812500000002 433.3386862179487,182.95372500000002 438.03177970085477,187.362675 442.72487318376074,190.84342500000002 447.4179666666667,194.788275 452.11106014957267,191.88765 456.8041536324787,197.68890000000002 461.49724711538465,205.1145 469.0061966880342,205.92667500000002 476.04583691239316,204.534375 483.08547713675216,204.6504 490.1251173611111,207.086925 494.8182108440171,199.893375 499.51130432692315,191.42355 504.2043978098291,187.130625 508.8974912927351,184.46205 513.590584775641,192.69982500000003 518.2836782585471,199.31325 522.976771741453,204.88245000000003 527.669865224359,211.37985 532.362958707265,216.13687500000003 539.402598931624,216.833025 546.442239155983,216.48495000000003 553.481879380342,214.976625 555.8284261217949,210.33562500000002 562.8680663461539,208.59525 565.6839224358976,207.78307500000003 L565.6839224358976,207.78307500000003" class="ftui l1_5" style="stroke-width: 302px" id="primary-graph-1-4-lines" animstate="hide" min="277.05" max="45" xrange="740.267" x0polar="NaN" y0polar="161.025"></path></g></g><g class="chart-parent" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" ai="0" height="232.05px" y="45px" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><g class="graph-parent" style="transform: translate(0,0) scale(1,1);"><polyline points=""></polyline><path d="M66.33877585470084,154.5276 L 66.33877585470084,154.5276 71.03186933760684,153.71542499999998 78.07150956196581,153.36735 85.11114978632477,152.6712 92.15079001068375,151.97505 94.49733675213675,149.770575 102.00628632478632,149.19045000000003 109.04592654914529,147.914175 116.08556677350427,148.378275 123.12520699786324,148.378275 130.16484722222222,148.378275 137.2044874465812,148.14622500000002 144.24412767094017,148.4943 151.28376789529915,146.753925 158.32340811965813,147.10200000000003 165.3630483440171,147.33405000000002 172.40268856837605,146.40585000000002 179.44232879273505,144.7815 186.481969017094,145.59367500000002 193.52160924145298,145.361625 200.56124946581198,146.52187500000002 207.60088969017093,146.52187500000002 214.6405299145299,146.52187500000002 221.6801701388889,145.7097 228.71981036324786,144.897525 235.75945058760684,144.897525 242.7990908119658,144.7815 249.83873103632482,144.7815 255.47044321581197,143.27317499999998 259.69422735042735,137.47192500000003 264.3873208333333,140.37255000000002 269.0804143162393,143.38920000000002 276.1200545405983,145.129575 278.9359106303419,146.289825 285.9755508547008,146.86995 293.01519107905983,147.5661 300.05483130341884,146.17380000000003 307.0944715277778,146.985975 314.1341117521368,147.68212499999998 321.17375197649574,148.03020000000004 328.21339220085474,148.14622500000002 331.0292482905983,135.9636 335.7223417735043,138.63217500000002 342.76198199786324,139.90845000000002 349.80162222222225,140.14049999999997 356.84126244658125,140.83665 359.18780918803424,141.648825 366.2274494123932,142.11292500000002 368.57399615384617,145.7097 373.73639898504274,154.99169999999998 377.96018311965815,168.68265000000002 382.6532766025641,177.848625 387.34637008547014,188.40690000000004 392.0394635683761,196.06455000000003 396.7325570512821,187.47870000000003 401.42565053418804,193.163925 408.465290758547,192.467775 409.4039094551282,161.025 416.4435496794872,161.025 418.7900964209402,168.21855 426.29904599358974,169.61085000000003 428.6455927350427,175.52812500000002 433.3386862179487,182.95372500000002 438.03177970085477,187.362675 442.72487318376074,190.84342500000002 447.4179666666667,194.788275 452.11106014957267,191.88765 456.8041536324787,197.68890000000002 461.49724711538465,205.1145 469.0061966880342,205.92667500000002 476.04583691239316,204.534375 483.08547713675216,204.6504 490.1251173611111,207.086925 494.8182108440171,199.893375 499.51130432692315,191.42355 504.2043978098291,187.130625 508.8974912927351,184.46205 513.590584775641,192.69982500000003 518.2836782585471,199.31325 522.976771741453,204.88245000000003 527.669865224359,211.37985 532.362958707265,216.13687500000003 539.402598931624,216.833025 546.442239155983,216.48495000000003 553.481879380342,214.976625 555.8284261217949,210.33562500000002 562.8680663461539,208.59525 565.6839224358976,207.78307500000003 L565.6839224358976,207.78307500000003" class="ftui l1_4" style="stroke-width: 0px" id="primary-graph-1-3-lines" animstate="hide" min="277.05" max="45" xrange="740.267" x0polar="NaN" y0polar="161.025"></path></g></g><g class="chart-parent" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" ai="0" height="232.05px" y="45px" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><g class="graph-parent" style="transform: translate(0,0) scale(1,1);"><polyline points=""></polyline><path d="M66.33877585470084,154.5276 L 66.33877585470084,154.5276 71.03186933760684,153.71542499999998 78.07150956196581,153.36735 85.11114978632477,152.6712 92.15079001068375,151.97505 94.49733675213675,149.770575 102.00628632478632,149.19045000000003 109.04592654914529,147.914175 116.08556677350427,148.378275 123.12520699786324,148.378275 130.16484722222222,148.378275 137.2044874465812,148.14622500000002 144.24412767094017,148.4943 151.28376789529915,146.753925 158.32340811965813,147.10200000000003 165.3630483440171,147.33405000000002 172.40268856837605,146.40585000000002 179.44232879273505,144.7815 186.481969017094,145.59367500000002 193.52160924145298,145.361625 200.56124946581198,146.52187500000002 207.60088969017093,146.52187500000002 214.6405299145299,146.52187500000002 221.6801701388889,145.7097 228.71981036324786,144.897525 235.75945058760684,144.897525 242.7990908119658,144.7815 249.83873103632482,144.7815 255.47044321581197,143.27317499999998 259.69422735042735,137.47192500000003 264.3873208333333,140.37255000000002 269.0804143162393,143.38920000000002 276.1200545405983,145.129575 278.9359106303419,146.289825 285.9755508547008,146.86995 293.01519107905983,147.5661 300.05483130341884,146.17380000000003 307.0944715277778,146.985975 314.1341117521368,147.68212499999998 321.17375197649574,148.03020000000004 328.21339220085474,148.14622500000002 331.0292482905983,135.9636 335.7223417735043,138.63217500000002 342.76198199786324,139.90845000000002 349.80162222222225,140.14049999999997 356.84126244658125,140.83665 359.18780918803424,141.648825 366.2274494123932,142.11292500000002 368.57399615384617,145.7097 373.73639898504274,154.99169999999998 377.96018311965815,168.68265000000002 382.6532766025641,177.848625 387.34637008547014,188.40690000000004 392.0394635683761,196.06455000000003 396.7325570512821,187.47870000000003 401.42565053418804,193.163925 408.465290758547,192.467775 409.4039094551282,161.025 416.4435496794872,161.025 418.7900964209402,168.21855 426.29904599358974,169.61085000000003 428.6455927350427,175.52812500000002 433.3386862179487,182.95372500000002 438.03177970085477,187.362675 442.72487318376074,190.84342500000002 447.4179666666667,194.788275 452.11106014957267,191.88765 456.8041536324787,197.68890000000002 461.49724711538465,205.1145 469.0061966880342,205.92667500000002 476.04583691239316,204.534375 483.08547713675216,204.6504 490.1251173611111,207.086925 494.8182108440171,199.893375 499.51130432692315,191.42355 504.2043978098291,187.130625 508.8974912927351,184.46205 513.590584775641,192.69982500000003 518.2836782585471,199.31325 522.976771741453,204.88245000000003 527.669865224359,211.37985 532.362958707265,216.13687500000003 539.402598931624,216.833025 546.442239155983,216.48495000000003 553.481879380342,214.976625 555.8284261217949,210.33562500000002 562.8680663461539,208.59525 565.6839224358976,207.78307500000003 L565.6839224358976,207.78307500000003" class="ftui l1_3" style="stroke-width: 0px" id="primary-graph-1-2-lines" animstate="hide" min="277.05" max="45" xrange="740.267" x0polar="NaN" y0polar="161.025"></path></g></g><g class="chart-parent" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" ai="0" height="232.05px" y="45px" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><g class="graph-parent" style="transform: translate(0,0) scale(1,1);"><polyline points=""></polyline><path d="M66.33877585470084,154.5276 L 66.33877585470084,154.5276 71.03186933760684,153.71542499999998 78.07150956196581,153.36735 85.11114978632477,152.6712 92.15079001068375,151.97505 94.49733675213675,149.770575 102.00628632478632,149.19045000000003 109.04592654914529,147.914175 116.08556677350427,148.378275 123.12520699786324,148.378275 130.16484722222222,148.378275 137.2044874465812,148.14622500000002 144.24412767094017,148.4943 151.28376789529915,146.753925 158.32340811965813,147.10200000000003 165.3630483440171,147.33405000000002 172.40268856837605,146.40585000000002 179.44232879273505,144.7815 186.481969017094,145.59367500000002 193.52160924145298,145.361625 200.56124946581198,146.52187500000002 207.60088969017093,146.52187500000002 214.6405299145299,146.52187500000002 221.6801701388889,145.7097 228.71981036324786,144.897525 235.75945058760684,144.897525 242.7990908119658,144.7815 249.83873103632482,144.7815 255.47044321581197,143.27317499999998 259.69422735042735,137.47192500000003 264.3873208333333,140.37255000000002 269.0804143162393,143.38920000000002 276.1200545405983,145.129575 278.9359106303419,146.289825 285.9755508547008,146.86995 293.01519107905983,147.5661 300.05483130341884,146.17380000000003 307.0944715277778,146.985975 314.1341117521368,147.68212499999998 321.17375197649574,148.03020000000004 328.21339220085474,148.14622500000002 331.0292482905983,135.9636 335.7223417735043,138.63217500000002 342.76198199786324,139.90845000000002 349.80162222222225,140.14049999999997 356.84126244658125,140.83665 359.18780918803424,141.648825 366.2274494123932,142.11292500000002 368.57399615384617,145.7097 373.73639898504274,154.99169999999998 377.96018311965815,168.68265000000002 382.6532766025641,177.848625 387.34637008547014,188.40690000000004 392.0394635683761,196.06455000000003 396.7325570512821,187.47870000000003 401.42565053418804,193.163925 408.465290758547,192.467775 409.4039094551282,161.025 416.4435496794872,161.025 418.7900964209402,168.21855 426.29904599358974,169.61085000000003 428.6455927350427,175.52812500000002 433.3386862179487,182.95372500000002 438.03177970085477,187.362675 442.72487318376074,190.84342500000002 447.4179666666667,194.788275 452.11106014957267,191.88765 456.8041536324787,197.68890000000002 461.49724711538465,205.1145 469.0061966880342,205.92667500000002 476.04583691239316,204.534375 483.08547713675216,204.6504 490.1251173611111,207.086925 494.8182108440171,199.893375 499.51130432692315,191.42355 504.2043978098291,187.130625 508.8974912927351,184.46205 513.590584775641,192.69982500000003 518.2836782585471,199.31325 522.976771741453,204.88245000000003 527.669865224359,211.37985 532.362958707265,216.13687500000003 539.402598931624,216.833025 546.442239155983,216.48495000000003 553.481879380342,214.976625 555.8284261217949,210.33562500000002 562.8680663461539,208.59525 565.6839224358976,207.78307500000003 L565.6839224358976,207.78307500000003" class="ftui l1_2" style="stroke-width: 1px" id="primary-graph-1-1-lines" animstate="hide" min="277.05" max="45" xrange="740.267" x0polar="NaN" y0polar="161.025"></path></g></g><g class="chart-parent" x="64.46153846153845px" width="675.8054615384616px" preserveAspectRatio="none" ai="0" height="232.05px" y="45px" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px 0px"><g class="graph-parent" style="transform: translate(0,0) scale(1,1);"><polyline points=""></polyline><path d="M66.33877585470084,277.05 L 66.33877585470084,154.5276 71.03186933760684,153.71542499999998 78.07150956196581,153.36735 85.11114978632477,152.6712 92.15079001068375,151.97505 94.49733675213675,149.770575 102.00628632478632,149.19045000000003 109.04592654914529,147.914175 116.08556677350427,148.378275 123.12520699786324,148.378275 130.16484722222222,148.378275 137.2044874465812,148.14622500000002 144.24412767094017,148.4943 151.28376789529915,146.753925 158.32340811965813,147.10200000000003 165.3630483440171,147.33405000000002 172.40268856837605,146.40585000000002 179.44232879273505,144.7815 186.481969017094,145.59367500000002 193.52160924145298,145.361625 200.56124946581198,146.52187500000002 207.60088969017093,146.52187500000002 214.6405299145299,146.52187500000002 221.6801701388889,145.7097 228.71981036324786,144.897525 235.75945058760684,144.897525 242.7990908119658,144.7815 249.83873103632482,144.7815 255.47044321581197,143.27317499999998 259.69422735042735,137.47192500000003 264.3873208333333,140.37255000000002 269.0804143162393,143.38920000000002 276.1200545405983,145.129575 278.9359106303419,146.289825 285.9755508547008,146.86995 293.01519107905983,147.5661 300.05483130341884,146.17380000000003 307.0944715277778,146.985975 314.1341117521368,147.68212499999998 321.17375197649574,148.03020000000004 328.21339220085474,148.14622500000002 331.0292482905983,135.9636 335.7223417735043,138.63217500000002 342.76198199786324,139.90845000000002 349.80162222222225,140.14049999999997 356.84126244658125,140.83665 359.18780918803424,141.648825 366.2274494123932,142.11292500000002 368.57399615384617,145.7097 373.73639898504274,154.99169999999998 377.96018311965815,168.68265000000002 382.6532766025641,177.848625 387.34637008547014,188.40690000000004 392.0394635683761,196.06455000000003 396.7325570512821,187.47870000000003 401.42565053418804,193.163925 408.465290758547,192.467775 409.4039094551282,161.025 416.4435496794872,161.025 418.7900964209402,168.21855 426.29904599358974,169.61085000000003 428.6455927350427,175.52812500000002 433.3386862179487,182.95372500000002 438.03177970085477,187.362675 442.72487318376074,190.84342500000002 447.4179666666667,194.788275 452.11106014957267,191.88765 456.8041536324787,197.68890000000002 461.49724711538465,205.1145 469.0061966880342,205.92667500000002 476.04583691239316,204.534375 483.08547713675216,204.6504 490.1251173611111,207.086925 494.8182108440171,199.893375 499.51130432692315,191.42355 504.2043978098291,187.130625 508.8974912927351,184.46205 513.590584775641,192.69982500000003 518.2836782585471,199.31325 522.976771741453,204.88245000000003 527.669865224359,211.37985 532.362958707265,216.13687500000003 539.402598931624,216.833025 546.442239155983,216.48495000000003 553.481879380342,214.976625 555.8284261217949,210.33562500000002 562.8680663461539,208.59525 565.6839224358976,207.78307500000003 L565.6839224358976,277.05 Z" class="fill" style="stroke-width: 1px" id="primary-graph-1-0-lines" animstate="hide" min="277.05" max="45" xrange="740.267" x0polar="NaN" y0polar="161.025"></path></g></g></svg><g class="lentries" style="transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); display: none;" x="0%" y="0px"><rect class="lback" style="position: relative;"></rect></g><g class="text axes"><g class="text yaxis_primary-0" style="-moz-transition:ease; -moz-transition-duration:0.5s; -moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg) translateX(0px); -moz-transform-origin: 64.46153846153845px 232.05px 0px"><text class="text axes yaxis" x="17" y="161.025" transform="rotate(-90 17,161.025)" text-anchor="middle"><tspan></tspan></text><text class="text axes yaxis" x="62.46153846153845px" y="258.845" text-anchor="end"><tspan>-8kW/h</tspan></text><text class="text axes yaxis" x="62.46153846153845px" y="212.435" text-anchor="end"><tspan>-4kW/h</tspan></text><text class="text axes yaxis" x="62.46153846153845px" y="166.025" text-anchor="end"><tspan>0kW/h</tspan></text><text class="text axes yaxis" x="62.46153846153845px" y="119.61500000000001" text-anchor="end"><tspan>4kW/h</tspan></text><text class="text axes yaxis" x="62.46153846153845px" y="73.20500000000001" text-anchor="end"><tspan>8kW/h</tspan></text></g><g class="text xaxis" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px 0px"><text class="text axes xaxis major" x="64.46153846153845px" y="294.05" text-anchor="middle"><tspan>25.09.</tspan></text><text class="text axes xaxis" x="120.77866025641026px" y="294.05" text-anchor="middle"><tspan>02:00</tspan></text><text class="text axes xaxis" x="177.09578205128207px" y="294.05" text-anchor="middle"><tspan>04:00</tspan></text><text class="text axes xaxis" x="233.41290384615388px" y="294.05" text-anchor="middle"><tspan>06:00</tspan></text><text class="text axes xaxis" x="289.7300256410257px" y="294.05" text-anchor="middle"><tspan>08:00</tspan></text><text class="text axes xaxis" x="346.0471474358975px" y="294.05" text-anchor="middle"><tspan>10:00</tspan></text><text class="text axes xaxis" x="402.3642692307693px" y="294.05" text-anchor="middle"><tspan>12:00</tspan></text><text class="text axes xaxis" x="458.68139102564106px" y="294.05" text-anchor="middle"><tspan>14:00</tspan></text><text class="text axes xaxis" x="514.9985128205128px" y="294.05" text-anchor="middle"><tspan>16:00</tspan></text><text class="text axes xaxis" x="571.3156346153846px" y="294.05" text-anchor="middle"><tspan>18:00</tspan></text><text class="text axes xaxis" x="627.6327564102565px" y="294.05" text-anchor="middle"><tspan>20:00</tspan></text><text class="text axes xaxis" x="683.9498782051284px" y="294.05" text-anchor="middle"><tspan>22:00</tspan></text><text class="text axes xaxis major" x="740.2670000000002px" y="294.05" text-anchor="middle"><tspan>26.09.</tspan></text></g></g><g class="crosshair" pointer-events="none" style="overflow: inherit"><line class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px 0px"></line><g class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px 0px"><text class="crosshair" filter="url(#filterbackground)" style="z-index: 10001; stroke-width: 0px; display: none;" text-anchor="end"><tspan class="crosshairValue"> </tspan></text></g><g class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><text class="crosshair" filter="url(#filterbackground)" style="z-index: 10001; stroke-width: 0px; display: none;" text-anchor="end"><tspan class="crosshairValue"> </tspan></text></g><g class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><text class="crosshair" filter="url(#filterbackground)" style="z-index: 10001; stroke-width: 0px; display: none;" text-anchor="end"><tspan class="crosshairValue"> </tspan></text></g><g class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><text class="crosshair" filter="url(#filterbackground)" style="z-index: 10001; stroke-width: 0px; display: none;" text-anchor="end"><tspan class="crosshairValue"> </tspan></text></g><g class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px NaNpx"><text class="crosshair" filter="url(#filterbackground)" style="z-index: 10001; stroke-width: 0px; display: none;" text-anchor="end"><tspan class="crosshairValue"> </tspan></text></g><g class="crosshair" style="-moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform-origin: 64.46153846153845px 232.05px 0px"><text class="crosshair" filter="url(#filterbackground)" style="z-index: 10001; stroke-width: 0px; display: none;" text-anchor="end"><tspan class="crosshairValue"> </tspan></text></g></g></g></svg></div>
Wichtig wäre noch, was im <head> Der Webseite steht.
alles was du willst:
<head>
<!--
* Version: 1.4.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<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">
<meta name="debug" content="0">
<meta name="widget_margin" content="10">
<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/css/fhem-tablet-ui-user.css" /-->
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<title>FHEM-Tablet-UI</title>
</head>
Bist Du sicher, dass das der Inhalt des headers des Browser Fensters (per Console Modus) nach dem Laden und Darstellen des Charts ist? Sieht für mich eher so aus wie der Header der augerufenen HTML Datei. Das Chart Widget fügt da zur Laufzeit zusätzliche Einträge dazu (genau die Styles, die nachher dann für die richtige Einfärbung sorgen).
Zitat von: eki am 26 September 2018, 08:09:03
Bist Du sicher, dass das der Inhalt des headers des Browser Fensters (per Console Modus) nach dem Laden und Darstellen des Charts ist? Sieht für mich eher so aus wie der Header der augerufenen HTML Datei. Das Chart Widget fügt da zur Laufzeit zusätzliche Einträge dazu (genau die Styles, die nachher dann für die richtige Einfärbung sorgen).
du hast Recht, habe auf Seitenquelltext anzeigen gedrückt, aber jetzt sollte es stimmen:
<head>
<!--
* Version: 1.4.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<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">
<meta name="debug" content="0">
<meta name="widget_margin" content="10">
<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/css/fhem-tablet-ui-user.css" /-->
<script src="/fhem/pgm2/jquery.min.js" defer=""></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer=""></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer=""></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer=""></script>
<title>FHEM-Tablet-UI</title>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script><style type="text/css"> [data-col="15"] { left:1914px; }
[data-col="14"] { left:1778px; }
[data-col="13"] { left:1642px; }
[data-col="12"] { left:1506px; }
[data-col="11"] { left:1370px; }
[data-col="10"] { left:1234px; }
[data-col="9"] { left:1098px; }
[data-col="8"] { left:962px; }
[data-col="7"] { left:826px; }
[data-col="6"] { left:690px; }
[data-col="5"] { left:554px; }
[data-col="4"] { left:418px; }
[data-col="3"] { left:282px; }
[data-col="2"] { left:146px; }
[data-col="1"] { left:10px; }
[data-row="16"] { top:2275px; }
[data-row="15"] { top:2124px; }
[data-row="14"] { top:1973px; }
[data-row="13"] { top:1822px; }
[data-row="12"] { top:1671px; }
[data-row="11"] { top:1520px; }
[data-row="10"] { top:1369px; }
[data-row="9"] { top:1218px; }
[data-row="8"] { top:1067px; }
[data-row="7"] { top:916px; }
[data-row="6"] { top:765px; }
[data-row="5"] { top:614px; }
[data-row="4"] { top:463px; }
[data-row="3"] { top:312px; }
[data-row="2"] { top:161px; }
[data-row="1"] { top:10px; }
[data-sizey="1"] { height:131px; }
[data-sizey="2"] { height:282px; }
[data-sizey="3"] { height:433px; }
[data-sizey="4"] { height:584px; }
[data-sizey="5"] { height:735px; }
[data-sizey="6"] { height:886px; }
[data-sizey="7"] { height:1037px; }
[data-sizey="8"] { height:1188px; }
[data-sizey="9"] { height:1339px; }
[data-sizey="10"] { height:1490px; }
[data-sizey="11"] { height:1641px; }
[data-sizey="12"] { height:1792px; }
[data-sizey="13"] { height:1943px; }
[data-sizey="14"] { height:2094px; }
[data-sizey="15"] { height:2245px; }
[data-sizex="1"] { width:116px; }
[data-sizex="2"] { width:252px; }
[data-sizex="3"] { width:388px; }
[data-sizex="4"] { width:524px; }
[data-sizex="5"] { width:660px; }
[data-sizex="6"] { width:796px; }
[data-sizex="7"] { width:932px; }
[data-sizex="8"] { width:1068px; }
[data-sizex="9"] { width:1204px; }
[data-sizex="10"] { width:1340px; }
[data-sizex="11"] { width:1476px; }
[data-sizex="12"] { width:1612px; }
[data-sizex="13"] { width:1748px; }
[data-sizex="14"] { width:1884px; }
</style><script type="text/javascript" async="" src="/fhem/tablet/js/widget_pagebutton.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_famultibutton.js"></script><script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script><script type="text/javascript" src="/fhem/tablet/lib/jquery-ui.min.js"></script><link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" type="text/css"><link rel="stylesheet" href="/fhem/tablet/lib/material-icons.min.css" type="text/css"><link rel="stylesheet" href="/fhem/tablet/lib/weather-icons.min.css" type="text/css"><style type="text/css"> [data-col="11"] { left:1370px; }
[data-col="10"] { left:1234px; }
[data-col="9"] { left:1098px; }
[data-col="8"] { left:962px; }
[data-col="7"] { left:826px; }
[data-col="6"] { left:690px; }
[data-col="5"] { left:554px; }
[data-col="4"] { left:418px; }
[data-col="3"] { left:282px; }
[data-col="2"] { left:146px; }
[data-col="1"] { left:10px; }
[data-row="26"] { top:3785px; }
[data-row="25"] { top:3634px; }
[data-row="24"] { top:3483px; }
[data-row="23"] { top:3332px; }
[data-row="22"] { top:3181px; }
[data-row="21"] { top:3030px; }
[data-row="20"] { top:2879px; }
[data-row="19"] { top:2728px; }
[data-row="18"] { top:2577px; }
[data-row="17"] { top:2426px; }
[data-row="16"] { top:2275px; }
[data-row="15"] { top:2124px; }
[data-row="14"] { top:1973px; }
[data-row="13"] { top:1822px; }
[data-row="12"] { top:1671px; }
[data-row="11"] { top:1520px; }
[data-row="10"] { top:1369px; }
[data-row="9"] { top:1218px; }
[data-row="8"] { top:1067px; }
[data-row="7"] { top:916px; }
[data-row="6"] { top:765px; }
[data-row="5"] { top:614px; }
[data-row="4"] { top:463px; }
[data-row="3"] { top:312px; }
[data-row="2"] { top:161px; }
[data-row="1"] { top:10px; }
[data-sizey="1"] { height:131px; }
[data-sizey="2"] { height:282px; }
[data-sizey="3"] { height:433px; }
[data-sizey="4"] { height:584px; }
[data-sizey="5"] { height:735px; }
[data-sizey="6"] { height:886px; }
[data-sizey="7"] { height:1037px; }
[data-sizey="8"] { height:1188px; }
[data-sizey="9"] { height:1339px; }
[data-sizey="10"] { height:1490px; }
[data-sizey="11"] { height:1641px; }
[data-sizey="12"] { height:1792px; }
[data-sizey="13"] { height:1943px; }
[data-sizey="14"] { height:2094px; }
[data-sizey="15"] { height:2245px; }
[data-sizey="16"] { height:2396px; }
[data-sizey="17"] { height:2547px; }
[data-sizey="18"] { height:2698px; }
[data-sizey="19"] { height:2849px; }
[data-sizey="20"] { height:3000px; }
[data-sizey="21"] { height:3151px; }
[data-sizey="22"] { height:3302px; }
[data-sizey="23"] { height:3453px; }
[data-sizey="24"] { height:3604px; }
[data-sizey="25"] { height:3755px; }
[data-sizex="1"] { width:116px; }
[data-sizex="2"] { width:252px; }
[data-sizex="3"] { width:388px; }
[data-sizex="4"] { width:524px; }
[data-sizex="5"] { width:660px; }
[data-sizex="6"] { width:796px; }
[data-sizex="7"] { width:932px; }
[data-sizex="8"] { width:1068px; }
[data-sizex="9"] { width:1204px; }
[data-sizex="10"] { width:1340px; }
</style><script type="text/javascript" async="" src="/fhem/tablet/js/widget_label.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_clock.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_switch.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_push.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_wind_direction.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_chart.js"></script><script type="text/javascript" async="" src="/fhem/tablet/js/widget_image.js"></script><style type="text/css"> [data-col="11"] { left:1370px; }
[data-col="10"] { left:1234px; }
[data-col="9"] { left:1098px; }
[data-col="8"] { left:962px; }
[data-col="7"] { left:826px; }
[data-col="6"] { left:690px; }
[data-col="5"] { left:554px; }
[data-col="4"] { left:418px; }
[data-col="3"] { left:282px; }
[data-col="2"] { left:146px; }
[data-col="1"] { left:10px; }
[data-row="16"] { top:2275px; }
[data-row="15"] { top:2124px; }
[data-row="14"] { top:1973px; }
[data-row="13"] { top:1822px; }
[data-row="12"] { top:1671px; }
[data-row="11"] { top:1520px; }
[data-row="10"] { top:1369px; }
[data-row="9"] { top:1218px; }
[data-row="8"] { top:1067px; }
[data-row="7"] { top:916px; }
[data-row="6"] { top:765px; }
[data-row="5"] { top:614px; }
[data-row="4"] { top:463px; }
[data-row="3"] { top:312px; }
[data-row="2"] { top:161px; }
[data-row="1"] { top:10px; }
[data-sizey="1"] { height:131px; }
[data-sizey="2"] { height:282px; }
[data-sizey="3"] { height:433px; }
[data-sizey="4"] { height:584px; }
[data-sizey="5"] { height:735px; }
[data-sizey="6"] { height:886px; }
[data-sizey="7"] { height:1037px; }
[data-sizey="8"] { height:1188px; }
[data-sizey="9"] { height:1339px; }
[data-sizey="10"] { height:1490px; }
[data-sizey="11"] { height:1641px; }
[data-sizey="12"] { height:1792px; }
[data-sizey="13"] { height:1943px; }
[data-sizey="14"] { height:2094px; }
[data-sizey="15"] { height:2245px; }
[data-sizex="1"] { width:116px; }
[data-sizex="2"] { width:252px; }
[data-sizex="3"] { width:388px; }
[data-sizex="4"] { width:524px; }
[data-sizex="5"] { width:660px; }
[data-sizex="6"] { width:796px; }
[data-sizex="7"] { width:932px; }
[data-sizex="8"] { width:1068px; }
[data-sizex="9"] { width:1204px; }
[data-sizex="10"] { width:1340px; }
</style><script type="text/javascript" async="" src="/fhem/tablet/js/widget_datetimepicker.js"></script><style type="text/css"> [data-col="11"] { left:1370px; }
[data-col="10"] { left:1234px; }
[data-col="9"] { left:1098px; }
[data-col="8"] { left:962px; }
[data-col="7"] { left:826px; }
[data-col="6"] { left:690px; }
[data-col="5"] { left:554px; }
[data-col="4"] { left:418px; }
[data-col="3"] { left:282px; }
[data-col="2"] { left:146px; }
[data-col="1"] { left:10px; }
[data-row="16"] { top:2275px; }
[data-row="15"] { top:2124px; }
[data-row="14"] { top:1973px; }
[data-row="13"] { top:1822px; }
[data-row="12"] { top:1671px; }
[data-row="11"] { top:1520px; }
[data-row="10"] { top:1369px; }
[data-row="9"] { top:1218px; }
[data-row="8"] { top:1067px; }
[data-row="7"] { top:916px; }
[data-row="6"] { top:765px; }
[data-row="5"] { top:614px; }
[data-row="4"] { top:463px; }
[data-row="3"] { top:312px; }
[data-row="2"] { top:161px; }
[data-row="1"] { top:10px; }
[data-sizey="1"] { height:131px; }
[data-sizey="2"] { height:282px; }
[data-sizey="3"] { height:433px; }
[data-sizey="4"] { height:584px; }
[data-sizey="5"] { height:735px; }
[data-sizey="6"] { height:886px; }
[data-sizey="7"] { height:1037px; }
[data-sizey="8"] { height:1188px; }
[data-sizey="9"] { height:1339px; }
[data-sizey="10"] { height:1490px; }
[data-sizey="11"] { height:1641px; }
[data-sizey="12"] { height:1792px; }
[data-sizey="13"] { height:1943px; }
[data-sizey="14"] { height:2094px; }
[data-sizey="15"] { height:2245px; }
[data-sizex="1"] { width:116px; }
[data-sizex="2"] { width:252px; }
[data-sizex="3"] { width:388px; }
[data-sizex="4"] { width:524px; }
[data-sizex="5"] { width:660px; }
[data-sizex="6"] { width:796px; }
[data-sizex="7"] { width:932px; }
[data-sizex="8"] { width:1068px; }
[data-sizex="9"] { width:1204px; }
[data-sizex="10"] { width:1340px; }
</style><script type="text/javascript" async="" src="/fhem/tablet/js/widget_volume.js"></script><link rel="stylesheet" href="/fhem/tablet/lib/jquery.datetimepicker.css" type="text/css"><script type="text/javascript" src="/fhem/tablet/lib/jquery.datetimepicker.min.js"></script><link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" type="text/css"><script type="text/javascript" async="" src="/fhem/tablet/js/widget_knob.js"></script><link rel="stylesheet" href="/fhem/tablet/css/ftui_chart.css" type="text/css"><script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script><style id="style_gr_ftui1_2" type="text/css">.ftui.l1_2 {fill: none; stroke:url(#gr_ftui1_2); stroke-width: -20px} text.ftui.l1_2 {stroke:none; fill:url(#gr_ftui1_2);}</style><style id="style_gr_ftui1_3" type="text/css">.ftui.l1_3 {fill: none; stroke:url(#gr_ftui1_3); stroke-width: 0px} text.ftui.l1_3 {stroke:none; fill:url(#gr_ftui1_3);}</style><style id="style_gr_ftui1_4" type="text/css">.ftui.l1_4 {fill: none; stroke:url(#gr_ftui1_4); stroke-width: 0px} text.ftui.l1_4 {stroke:none; fill:url(#gr_ftui1_4);}</style><style id="style_gr_ftui1_5" type="text/css">.ftui.l1_5 {fill: none; stroke:url(#gr_ftui1_5); stroke-width: 302px} text.ftui.l1_5 {stroke:none; fill:url(#gr_ftui1_5);}</style></head>
Das bringt mich ein bisschen weiter. Kannst Du bitte mal mit folgender Definition testen:
data-style='[["fill",["-20","#0000ff","0.7"],["0","#0000ff","0"],["0","#ff0000","0"],["20","#ff0000","0.7"]]]'
Zitat von: eki am 26 September 2018, 09:39:15
Das bringt mich ein bisschen weiter. Kannst Du bitte mal mit folgender Definition testen:
data-style='[["fill",["-20","#0000ff","0.7"],["0","#0000ff","0"],["0","#ff0000","0"],["20","#ff0000","0.7"]]]'
sieht dann so aus...
Kannst Du bitte noch mal schauen, wie es aussieht, wenn Du folgende Version des Charts verwendest (ich hoffe, der Fehler, den ich gefunden habe, löst Dein Problem).
In Deinem Beispiel wirst Du dann den oberen Teil des Graphen immer noch sehr schwach sehen, das ist aber so, weil Deine Werte eben nur einen Teil des definierten Wertebereich des Stils abdecken und von 0 an ja erst mal durchsichtig gezeichnet wird. Du kannst eventuell den gleichen Graphen noch mal dazufügen und den dann als Linie zeichnen lassen (statt 'fill' eine Zahl, die die Dicke angiebt).
Zitat von: eki am 26 September 2018, 14:51:41
Kannst Du bitte noch mal schauen, wie es aussieht, wenn Du folgende Version des Charts verwendest (ich hoffe, der Fehler, den ich gefunden habe, löst Dein Problem).
In Deinem Beispiel wirst Du dann den oberen Teil des Graphen immer noch sehr schwach sehen, das ist aber so, weil Deine Werte eben nur einen Teil des definierten Wertebereich des Stils abdecken und von 0 an ja erst mal durchsichtig gezeichnet wird. Du kannst eventuell den gleichen Graphen noch mal dazufügen und den dann als Linie zeichnen lassen (statt 'fill' eine Zahl, die die Dicke angiebt).
danke dir, sieht gut aus, aber ich habe die stildefination folgendermaßen geändert:
data-style='[[2,["-8","#0000ff","0.7"],["0","#0000ff","0.7"],["0","#ff0000","0.7"],["8","#ff0000","0.7"]]]'
um einen harten Übergang zischen rot und blau zu erreichen und nur eine Linie angezeigt zu bekommen.
leider beginnt der blaue Bereich nicht wie erwartet bei 0, sondern es wird je nach Ausschnitt der kleinste Wert des Graphen blau gezeichnet
Bist Du sicher, dass die von mir geschickte Chart Version aktiv ist (an die richtig Stelle kopiert, und den Browser Cache mit Strg-Shift+Entf gelöscht)?
Ansonsten schicke bitte noch mal Deine neue Definition und vielleicht auch die passende Liste aus Deiner LogDB.
Zitat von: eki am 26 September 2018, 16:24:51
Bist Du sicher, dass die von mir geschickte Chart Version aktiv ist (an die richtig Stelle kopiert, und den Browser Cache mit Strg-Shift+Entf gelöscht)?
Ansonsten schicke bitte noch mal Deine neue Definition und vielleicht auch die passende Liste aus Deiner LogDB.
ja soeben auch noch mal wiederholt,
logdb
<ROW TIMESTAMP="20180726T00:11:26000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.08" READING="kiloWatt" VALUE="0.08" UNIT=""/>
<ROW TIMESTAMP="20180726T00:26:27000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.07" READING="kiloWatt" VALUE="0.07" UNIT=""/>
<ROW TIMESTAMP="20180726T00:37:09000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.15" READING="kiloWatt" VALUE="0.15" UNIT=""/>
<ROW TIMESTAMP="20180726T00:52:10000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.13" READING="kiloWatt" VALUE="0.13" UNIT=""/>
<ROW TIMESTAMP="20180726T01:07:11000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.13" READING="kiloWatt" VALUE="0.13" UNIT=""/>
<ROW TIMESTAMP="20180726T01:22:11000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.13" READING="kiloWatt" VALUE="0.13" UNIT=""/>
<ROW TIMESTAMP="20180726T01:37:12000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.12" READING="kiloWatt" VALUE="0.12" UNIT=""/>
<ROW TIMESTAMP="20180726T01:52:22000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.10" READING="kiloWatt" VALUE="0.10" UNIT=""/>
<ROW TIMESTAMP="20180726T02:07:23000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.09" READING="kiloWatt" VALUE="0.09" UNIT=""/>
<ROW TIMESTAMP="20180726T02:22:23000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.09" READING="kiloWatt" VALUE="0.09" UNIT=""/>
<ROW TIMESTAMP="20180726T02:37:24000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.09" READING="kiloWatt" VALUE="0.09" UNIT=""/>
<ROW TIMESTAMP="20180726T02:52:25000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.11" READING="kiloWatt" VALUE="0.11" UNIT=""/>
<ROW TIMESTAMP="20180726T03:07:26000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.13" READING="kiloWatt" VALUE="0.13" UNIT=""/>
<ROW TIMESTAMP="20180726T03:22:26000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.14" READING="kiloWatt" VALUE="0.14" UNIT=""/>
<ROW TIMESTAMP="20180726T03:37:27000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.14" READING="kiloWatt" VALUE="0.14" UNIT=""/>
<ROW TIMESTAMP="20180726T03:52:28000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.16" READING="kiloWatt" VALUE="0.16" UNIT=""/>
<ROW TIMESTAMP="20180726T04:07:29000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.17" READING="kiloWatt" VALUE="0.17" UNIT=""/>
<ROW TIMESTAMP="20180726T04:22:29000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.17" READING="kiloWatt" VALUE="0.17" UNIT=""/>
<ROW TIMESTAMP="20180726T04:37:44000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.18" READING="kiloWatt" VALUE="0.18" UNIT=""/>
<ROW TIMESTAMP="20180726T04:52:44000" DEVICE="Status_Pufferspeicher_Verbrauch" TYPE="MQTT_DEVICE" EVENT="kiloWatt: 0.17" READING="kiloWatt" VALUE="0.17" UNIT=""/><div data-type="chart"
data-device="Status_Pufferspeicher_Verbrauch"
date-get="Status_Pufferspeicher_Verbrauch"
data-logdevice="logdb"
data-logfile="HISTORY"
data-columnspec="Status_Pufferspeicher_Verbrauch:kiloWatt"
data-uaxis="primary"
data-style='[[2,["-8","#0000ff","0.7"],["-0.1","#0000ff","0.7"],["0.1","#ff0000","0.7"],["8","#ff0000","0.7"]]]'
data-yunit="kW/h"
data-minvalue="-10"
data-maxvalue="10"
data-title="Wärmeverbrauch"
class="fullsize">
</div>
noch ein Hinweis von mir, mit der Definition 'fill' funktioniert es einwandfrei, allerdings nicht mit Strichstärke 2
und ich habe heute durch Zufall noch etwas entdeckt, auch wenn der Chart überhaupt nicht in den negativen Bereich geht, wird der niedrigste Bereich blau gezeichnet
<div data-type="chart"
data-device="Status_Pufferspeicher_Verbrauch"
date-get="Status_Pufferspeicher_Verbrauch"
data-logdevice="logdb"
data-logfile="HISTORY"
data-columnspec="Status_Pufferspeicher_Verbrauch:kiloWatt"
data-uaxis="primary"
data-style='[[3,["-8","#0000ff","1"],["0","#0000ff","1"],["0","#ff0000","1"],["8","#ff0000","1"]]]'
data-yunit="kW/h"
data-minvalue="-10"
data-maxvalue="10"
data-title="Wärmeverbrauch"
class="fullsize">
</div>
Mit der zusätzlichen [] und die Linienstärke mit " funktioniert es bei mir
data-style='[["2",["-500","#0000ff","0.7"],["0","#0000ff","0.7"],["0","#00ff00","0.7"],["3ß00","#00ff00","0.7"]]]'