Minor fixes to data updates

This commit is contained in:
M 2020-06-13 17:37:44 -05:00
parent 8ec6fc5885
commit d478135af1
2 changed files with 17 additions and 16 deletions

View file

@ -203,7 +203,8 @@ function applyOptions() {
).prop("checked", doAnimations); ).prop("checked", doAnimations);
} }
if (options.refresh_rate !== refreshRate) { if (options.refresh_rate !== refreshRate) {
console.log(options.refresh_rate + " " + refreshRate); clearInterval(statRequest);
statRequest = setInterval(getStats, refreshRate);
refreshRate = Math.max(options.refresh_rate, 500); refreshRate = Math.max(options.refresh_rate, 500);
$("#dataRefreshRate").addClass("updated").on( $("#dataRefreshRate").addClass("updated").on(
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd", "animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
@ -336,34 +337,34 @@ function updateValues(data) {
hitmiss.data.datasets[0].data[1] = x.cache_misses; hitmiss.data.datasets[0].data[1] = x.cache_misses;
hitmiss.data.datasets[0].data[2] = x.browser_cached; hitmiss.data.datasets[0].data[2] = x.browser_cached;
hitmiss.update(); hitmiss.update();
req.data.labels.push(key); req.data.labels.push(key.substring(key.indexOf("T") + 1, key.indexOf("Z")));
req.data.datasets.forEach((dataset) => { req.data.datasets.forEach((dataset) => {
dataset.data.push(x.requests_served); dataset.data.push(x.requests_served);
}); });
req.update(); req.update();
byte.data.labels.push(key); byte.data.labels.push(key.substring(key.indexOf("T") + 1, key.indexOf("Z")));
byte.data.datasets.forEach((dataset) => { byte.data.datasets.forEach((dataset) => {
dataset.data.push(x.bytes_sent); dataset.data.push(x.bytes_sent);
}); });
byte.update(); byte.update();
cached.data.labels.push(key); cached.data.labels.push(key.substring(key.indexOf("T") + 1, key.indexOf("Z")));
cached.data.datasets.forEach((dataset) => { cached.data.datasets.forEach((dataset) => {
dataset.data.push(x.bytes_on_disk); dataset.data.push(x.bytes_on_disk);
}); });
cached.update() cached.update();
} }
} }
let points = graphTimeFrame / refreshRate; let points = graphTimeFrame / refreshRate;
if (req.data.label.length > points) { if (req.data.labels.length > points) {
req.data.labels.splice(0, req.data.label.length - points); req.data.labels.splice(0, req.data.labels.length - points);
req.data.datasets.splice(0, req.data.datasets.length - points); req.data.datasets.splice(0, req.data.datasets.length - points);
} }
if (byte.data.label.length > points) { if (byte.data.labels.length > points) {
byte.data.labels.splice(0, req.data.label.length - points); byte.data.labels.splice(0, byte.data.labels.length - points);
byte.data.datasets.splice(0, req.data.datasets.length - points); byte.data.datasets.splice(0, byte.data.datasets.length - points);
} }
if (cached.data.label.length > points) { if (cached.data.labels.length > points) {
cached.data.labels.splice(0, req.data.label.length - points); cached.data.labels.splice(0, cached.data.labels.length - points);
cached.data.datasets.splice(0, req.data.datasets.length - points); cached.data.datasets.splice(0, cached.data.datasets.length - points);
} }
} }

View file

@ -47,13 +47,13 @@
<div id="thegraphfamily" <div id="thegraphfamily"
style="position: absolute; width: calc(70% - 80px); margin: 20px; left: calc(30% + 40px); top: 100px"> style="position: absolute; width: calc(70% - 80px); margin: 20px; left: calc(30% + 40px); top: 100px">
<div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data"> <div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data">
<canvas id="bytessent" style="height: 250px"></canvas> <canvas id="bytessent" style="height: 350px"></canvas>
</div> </div>
<div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data"> <div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data">
<canvas id="requestsserved" style="height: 250px"></canvas> <canvas id="requestsserved" style="height: 350px"></canvas>
</div> </div>
<div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data"> <div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data">
<canvas id="browsercached" style="height: 250px"></canvas> <canvas id="browsercached" style="height: 350px"></canvas>
</div> </div>
</div> </div>
</div> </div>