prepare playground for chart JS min max stuff

This commit is contained in:
DeltaLima 2025-04-13 21:46:34 +02:00
parent 98c016a41f
commit 402d8aaec0
2 changed files with 44 additions and 21 deletions
include
playground/html/root

View file

@ -10,7 +10,7 @@
* DEBUG is less noisy messages
* DEBUG2 are noisy messages
* DEBUG3 are super noisy messages */
#define DEBUG
//#define DEBUG
//#define DEBUG2
//#define DEBUG3

View file

@ -13,7 +13,7 @@
<li><a class='' href='/system/' >&#9881; System settings</a></li>
<li><a class='' href='/wifi/' >&#128225; WiFi settings</a></li>
<li><a class='' href='/help' >&#x2753; Help</a></li>
<li><span class='navTime'>01:49:46</span></li>
<li><span class='navTime'>20:42:59</span></li>
<li><a href='https://git.la10cy.net/DeltaLima/CanGrow' target='_blank'>CanGrow v0.2-dev3</a></li>
</ul>
<div class='center'>
@ -94,31 +94,54 @@
</div>
</div><div style='clear: both;'></div>
<script>var gaugeJS_1_0_0 = new Gauge(document.getElementById('gauge_1_0_0'));
gaugeJS_1_0_0.value('19.61', 35, ' °C');
gaugeJS_1_0_0.value('22.51', 35, ' °C');
var gaugeJS_2_0_1 = new Gauge(document.getElementById('gauge_2_0_1'));
gaugeJS_2_0_1.value('54.48', 100, ' %');
gaugeJS_2_0_1.value('46.60', 100, ' %');
var gaugeJS_3_1_0 = new Gauge(document.getElementById('gauge_3_1_0'));
gaugeJS_3_1_0.value('91.00', 100, ' %');
gaugeJS_3_1_0.value('94.00', 100, ' %');
var gaugeJS_4_2_0 = new Gauge(document.getElementById('gauge_4_2_0'));
gaugeJS_4_2_0.value('20.73', 42, ' °C');
gaugeJS_4_2_0.value('21.92', 42, ' °C');
var gaugeJS_5_2_1 = new Gauge(document.getElementById('gauge_5_2_1'));
gaugeJS_5_2_1.value('53.90', 100, ' %');
gaugeJS_5_2_1.value('48.66', 100, ' %');
</script>
<br>
<script type='application/json' id='chartJson'>{"chart":[{"id":0,"name":"BME280 inside","descr":"Temperature","unit":"°C","data":[19.99,19.84,19.77,19.69,19.64,19.62,19.62,19.64,19.65,19.64,19.68,19.66,19.65,19.64,19.64,19.76,22.54,23.29,23.49,23.7,23.94,23.88,23.81,23.86,23.9,23.9,24.35,25.43,25.91,25.91,25.42,24.02,23.54,23.4,23.72,23.7,23.81,23.6,23.58,23.18,22.96,22.88,22.84,22.81,22.81,22.81,22.75,22.75,22.74,22.63,20.07,19.62,19.54,19.48,19.62],"timestamp":[1744416219,1744417119,1744418019,1744419722,1744421528,1744422875,1744423774,1744424674,1744425574,1744427940,1744429740,1744431540,1744433341,1744435141,1744436941,1744438741,1744440541,1744442341,1744444141,1744445941,1744447741,1744449541,1744451341,1744453141,1744454941,1744456741,1744458541,1744460341,1744462140,1744463940,1744465740,1744467540,1744469340,1744471140,1744472940,1744474740,1744476540,1744478340,1744480140,1744481940,1744483740,1744485540,1744487340,1744489140,1744490940,1744492740,1744494540,1744496340,1744498140,1744499940,1744501740,1744503540,1744505340,1744507140,1744508940],"datapoints":55},{"id":1,"name":"BME280 inside","descr":"Humidity","unit":"%","data":[61.43,62.99,63.62,62.37,63.26,63.21,64.52,66.1,66.74,53.51,52.66,52.26,51.96,51.67,51.36,50.93,45.61,44.06,43.75,43.77,43.75,44.21,44.07,43.79,43.85,43.79,42.8,41.01,39.96,40.75,42.38,42.7,42.57,42.69,43.65,44.92,44.29,45.19,47.33,49.34,49.12,49.12,49.08,49.17,48.81,48.5,48.49,48.28,48.6,48.16,53.27,54.24,54.11,53.71,54.54],"timestamp":[1744416219,1744417119,1744418019,1744419722,1744421528,1744422875,1744423775,1744424675,1744425575,1744427941,1744429741,1744431540,1744433341,1744435141,1744436941,1744438741,1744440541,1744442341,1744444141,1744445941,1744447741,1744449541,1744451341,1744453141,1744454941,1744456741,1744458541,1744460341,1744462141,1744463941,1744465741,1744467541,1744469341,1744471141,1744472941,1744474741,1744476541,1744478341,1744480141,1744481941,1744483741,1744485541,1744487341,1744489141,1744490941,1744492741,1744494541,1744496341,1744498141,1744499941,1744501741,1744503541,1744505341,1744507141,1744508941],"datapoints":55},
{"id":2,"name":"SHT30 outside","descr":"Humidity","unit":"%","data":
[52.48,52.21,52.27,52.26,51.96,51.58,51.34,51.06,50.89,50.68,50.51,49.29,48.04,47.4,47.44,47.18,
47.65,47.68,47.4,47.49,47.51,47.28,46.73,46.72,46.78,47.87,44.58,44.23,44.18,48.54,49,48.94,49.57,
53.29,54.93,54.94,54.85,54.44,53.91,53.84,53.27,53.98,53.79,53.04,52.89,54.2,54.27,53.96,53.59,53.89],
"timestamp":[1744422875,1744423775,1744424675,1744425575,1744427941,1744429741,1744431541,1744433342,1744435141,1744436941,1744438741,
1744440541,1744442341,1744444141,1744445941,1744447741,1744449541,1744451341,1744453141,1744454941,1744456741,1744458541,1744460341,
1744462141,1744463941,1744465741,1744467541,1744469341,1744471141,1744472941,1744474741,1744476541,1744478341,1744480141,1744481941,
1744483741,1744485541,1744487341,1744489141,1744490941,1744492741,1744494541,1744496341,1744498141,1744499941,1744501741,1744503541,
1744505341,1744507141,1744508941],
"datapoints":50}]}</script>
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/charts.css/dist/charts.min.css'><div id='chartDiv'><table id='chartTable' class='charts-css line multiple show-data-on-hover show-primary-axis show-6-secondary-axes'><caption>Linechart</caption></table><ul id='chartLegend' class='charts-css legend legend-line'></ul></div><script>DrawChart();</script>
<script type='application/json' id='chartJson'>{"chart":[
{
"id":0,
"name":"BME280 inside",
"descr":"Temperature",
"unit":"°C",
"min":0,
"max":0,
"data":[19.99,19.84,19.77,19.69,19.64,19.62,19.62,19.64,19.65,19.64,19.68,19.66,19.65,19.64,19.64,19.76,22.54,23.29,23.49,23.7,23.94,23.88,23.81,23.86,23.9,23.9,24.35,25.43,25.91,25.91,25.42,24.02,23.54,23.4,23.72,23.7,23.81,23.6,23.58,23.18,22.96,22.88,22.84,22.81,22.81,22.81,22.75,22.75,22.74,22.63,20.07,19.62,19.54,19.48,19.62,19.52,19.68,19.71,19.57,19.49,19.45,19.39,19.38,19.49,22.09,22.77,22.72,22.82,22.95,23.15,23.55,23.65,24.02,24.38,24.04,23.68,23.59,23.73,24.17,24.13,24.08,23.77,23.61,23.5,23.56,23.43,23.44,23.23,23.3,23.11,22.72],
"timestamp":[1744416219,1744417119,1744418019,1744419722,1744421528,1744422875,1744423774,1744424674,1744425574,1744427940,1744429740,1744431540,1744433341,1744435141,1744436941,1744438741,1744440541,1744442341,1744444141,1744445941,1744447741,1744449541,1744451341,1744453141,1744454941,1744456741,1744458541,1744460341,1744462140,1744463940,1744465740,1744467540,1744469340,1744471140,1744472940,1744474740,1744476540,1744478340,1744480140,1744481940,1744483740,1744485540,1744487340,1744489140,1744490940,1744492740,1744494540,1744496340,1744498140,1744499940,1744501740,1744503540,1744505340,1744507140,1744508940,1744510740,1744512540,1744514340,1744516140,1744517940,1744519740,1744521540,1744523340,1744525140,1744526940,1744528740,1744530540,1744532340,1744534140,1744535940,1744537740,1744539540,1744541340,1744543140,1744544940,1744546740,1744548540,1744550340,1744552140,1744553940,1744555740,1744557540,1744559340,1744561140,1744562940,1744566322,1744568121,1744569921,1744571721,1744573521,1744575322],
"datapoints":91
},
{
"id":1,
"name":"BME280 inside",
"descr":"Humidity",
"unit":"%",
"min":0,
"max":0,
"data":[61.43,62.99,63.62,62.37,63.26,63.21,64.52,66.1,66.74,53.51,52.66,52.26,51.96,51.67,51.36,50.93,45.61,44.06,43.75,43.77,43.75,44.21,44.07,43.79,43.85,43.79,42.8,41.01,39.96,40.75,42.38,42.7,42.57,42.69,43.65,44.92,44.29,45.19,47.33,49.34,49.12,49.12,49.08,49.17,48.81,48.5,48.49,48.28,48.6,48.16,53.27,54.24,54.11,53.71,54.54,54.96,55.53,54.65,54.47,54.19,54.1,53.87,53.71,53.58,47.76,46.24,46.84,46.7,46.29,48.43,46.94,47.6,47.59,47.39,47,47.74,45.78,45.72,47.48,48.34,47.53,46.79,46.31,47.59,47.69,47.99,48.61,46.25,48.68,46.35,46.65],
"timestamp":[1744416219,1744417119,1744418019,1744419722,1744421528,1744422875,1744423775,1744424675,1744425575,1744427941,1744429741,1744431540,1744433341,1744435141,1744436941,1744438741,1744440541,1744442341,1744444141,1744445941,1744447741,1744449541,1744451341,1744453141,1744454941,1744456741,1744458541,1744460341,1744462141,1744463941,1744465741,1744467541,1744469341,1744471141,1744472941,1744474741,1744476541,1744478341,1744480141,1744481941,1744483741,1744485541,1744487341,1744489141,1744490941,1744492741,1744494541,1744496341,1744498141,1744499941,1744501741,1744503541,1744505341,1744507141,1744508941,1744510741,1744512541,1744514341,1744516141,1744517941,1744519741,1744521541,1744523341,1744525141,1744526941,1744528741,1744530541,1744532341,1744534141,1744535941,1744537741,1744539541,1744541341,1744543141,1744544941,1744546741,1744548541,1744550341,1744552141,1744553941,1744555741,1744557541,1744559341,1744561141,1744562941,1744566322,1744568122,1744569922,1744571721,1744573521,1744575322],
"datapoints":91
},
{
"id":2,
"name":"SHT30 outside",
"descr":"Humidity",
"unit":"%",
"min":0,
"max":0,
"data":[52.48,52.21,52.27,52.26,51.96,51.58,51.34,51.06,50.89,50.68,50.51,49.29,48.04,47.4,47.44,47.18,47.65,47.68,47.4,47.49,47.51,47.28,46.73,46.72,46.78,47.87,44.58,44.23,44.18,48.54,49,48.94,49.57,53.29,54.93,54.94,54.85,54.44,53.91,53.84,53.27,53.98,53.79,53.04,52.89,54.2,54.27,53.96,53.59,53.89,54,53.94,54.04,54.04,53.81,53.54,53.43,53.14,53.13,51.52,50.09,50.07,49.83,50.23,50.09,49.35,49.46,49.23,49.31,49.87,50.17,46.56,46.91,45.15,45.59,43.59,47.36,48.29,50.69,51.19,51.93,52.58,52.2,52.27,50.53,49.24],
"timestamp":[1744422875,1744423775,1744424675,1744425575,1744427941,1744429741,1744431541,1744433342,1744435141,1744436941,1744438741,1744440541,1744442341,1744444141,1744445941,1744447741,1744449541,1744451341,1744453141,1744454941,1744456741,1744458541,1744460341,1744462141,1744463941,1744465741,1744467541,1744469341,1744471141,1744472941,1744474741,1744476541,1744478341,1744480141,1744481941,1744483741,1744485541,1744487341,1744489141,1744490941,1744492741,1744494541,1744496341,1744498141,1744499941,1744501741,1744503541,1744505341,1744507141,1744508941,1744510741,1744512541,1744514341,1744516141,1744517941,1744519741,1744521541,1744523341,1744525141,1744526941,1744528741,1744530541,1744532341,1744534141,1744535941,1744537741,1744539541,1744541341,1744543141,1744544941,1744546741,1744548541,1744550341,1744552141,1744553941,1744555741,1744557541,1744559341,1744561141,1744562941,1744566322,1744568122,1744569922,1744571722,1744573522,1744575322],
"datapoints":86
}
]}
</script><link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/charts.css/dist/charts.min.css'><div id='chartDiv'><table id='chartTable' class='charts-css line multiple show-data-on-hover show-primary-axis show-6-secondary-axes'><caption>Linechart</caption></table><ul id='chartLegend' class='charts-css legend legend-line'></ul></div><script>DrawChart();</script>
<div class='footer'><span>Build: a9635cc-esp8266_d1_mini_clone-20250412034442</span></div></div></body></html>
<div class='footer'><span>Build: 98c016a-esp8266_d1_mini_clone-20250413213840</span></div></div></body></html>