X-Git-Url: https://git.toastfreeware.priv.at/chrisu/seepark.git/blobdiff_plain/480131b30d68c715e6187a96cd669db1f1fd3e0b..3dc2b087a5e3cb7952392cb00a4469508af6e019:/web/static/seepark_web.js?ds=sidebyside diff --git a/web/static/seepark_web.js b/web/static/seepark_web.js index ca30ac1..904810a 100644 --- a/web/static/seepark_web.js +++ b/web/static/seepark_web.js @@ -17,7 +17,11 @@ var chart = c3.generate({ '0316a2193bff': 'Wassertemperatur in 4 m Tiefe', '0316a21383ff': 'Wassertemperatur in 5 m Tiefe' }, - xFormat: '%Y-%m-%d %H:%M:%S' + xFormat: '%Y-%m-%d %H:%M:%S', + colors: { + '0316a2193bff': 'lightblue', + '0316a21383ff': 'darkblue' + } }, axis: { x: { @@ -42,7 +46,19 @@ var chart = c3.generate({ } }, zoom: { - enabled: true + enabled: true, + onzoomend: function (domain) { + // UNIX epoch + var start = domain[0].getTime()/1000; + var end = domain[1].getTime()/1000; + var duration = end - start; + // duration is now the diff of the "viewport in seconds" + // FIXME + var days = Math.round(duration / 86400 / 2); + if (days > 0) { + loaddays(days); + } + } }, tooltip: { format: { @@ -52,7 +68,7 @@ var chart = c3.generate({ return res; }, value: function (value, ratio, id, index) { - return value + '°'; + return value.toFixed(2) + '°'; } } }, @@ -69,3 +85,9 @@ var chart = c3.generate({ ] }); +function loaddays(days) { + chart.load({ + url: '/data/' + days, + mimeType: 'json' + }); +}