prometheus/cadvisor
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #365 from vmarmol/ui

Browse Source 
Dynamically update FS gauges in a stable way.
This commit is contained in:
Rohit Jnagal 2014-12-16 11:38:07 -08:00
commit d4a39887aa
2 changed files with 21 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
pages/containers_html.go
View File

@ -106,8 +106,7 @@ const containersHtmlTemplate = `
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Overview</h3> <h3 class="panel-title">Overview</h3>
</div> </div>
<div id="usage-gauge" class="panel-body"> <div id="usage-gauge" class="panel-body"></div>
</div>
</div> </div>
{{if .CpuAvailable}} {{if .CpuAvailable}}
<div class="panel panel-primary"> <div class="panel panel-primary">

41
pages/static/containers_js.go
View File

@ -1487,20 +1487,11 @@ function hasResource(stats, resource) {
return stats.stats.length > 0 && stats.stats[0][resource]; return stats.stats.length > 0 && stats.stats[0][resource];
} }
// Draw a gauge. // Draw a set of gauges. Data is comprised of an array of arrays with two elements:
function drawGauge(elementId, cpuUsage, memoryUsage, fsUsage) { // a string label and a numeric value for the gauge.
var gauges = [['Label', 'Value']]; function drawGauges(elementId, gauges) {
if (cpuUsage >= 0) { gauges.unshift(['Label', 'Value']);
gauges.push(['CPU', cpuUsage]);
}
if (memoryUsage >= 0) {
gauges.push(['Memory', memoryUsage]);
}
for (var i = 0; i < fsUsage.length; i++) {
if (fsUsage[i] >= 0) {
gauges.push(['FS #' + (i + 1), fsUsage[i]]);
}
}
// Create and populate the data table. // Create and populate the data table.
var data = google.visualization.arrayToDataTable(gauges); var data = google.visualization.arrayToDataTable(gauges);
@ -1612,6 +1603,7 @@ function drawCpuUsageBreakdown(elementId, machineInfo, containerInfo) {
// Draw the gauges for overall resource usage. // Draw the gauges for overall resource usage.
function drawOverallUsage(elementId, machineInfo, containerInfo) { function drawOverallUsage(elementId, machineInfo, containerInfo) {
var cur = containerInfo.stats[containerInfo.stats.length - 1]; var cur = containerInfo.stats[containerInfo.stats.length - 1];
var gauges = [];
var cpuUsage = 0; var cpuUsage = 0;
if (containerInfo.spec.has_cpu && containerInfo.stats.length >= 2) { if (containerInfo.spec.has_cpu && containerInfo.stats.length >= 2) {
@ -1624,6 +1616,7 @@ function drawOverallUsage(elementId, machineInfo, containerInfo) {
if (cpuUsage > 100) { if (cpuUsage > 100) {
cpuUsage = 100; cpuUsage = 100;
} }
gauges.push(['CPU', cpuUsage]);
} }
var memoryUsage = 0; var memoryUsage = 0;
@ -1635,18 +1628,20 @@ function drawOverallUsage(elementId, machineInfo, containerInfo) {
} }
memoryUsage = Math.round((cur.memory.usage / limit) * 100); memoryUsage = Math.round((cur.memory.usage / limit) * 100);
gauges.push(['Memory', memoryUsage]);
} }
var fsUsage=[]; var numGauges = gauges.length;
if (containerInfo.spec.has_filesystem) {
for (var i = 0; i < cur.filesystem.length; i++) { for (var i = 0; i < cur.filesystem.length; i++) {
var limit = cur.filesystem[0].capacity; var data = cur.filesystem[i];
var diskUsage = Math.round((cur.filesystem[0].usage / limit) * 100); var totalUsage = Math.floor((data.usage * 100.0) / data.capacity);
fsUsage.push(diskUsage); var els = window.cadvisor.fsUsage.elements[data.device];
}
// Update the gauges.
gauges[numGauges + els.index] = ['FS #' + (els.index + 1), totalUsage];
} }
drawGauge(elementId, cpuUsage, memoryUsage, fsUsage); drawGauges(elementId, gauges);
} }
var oneMegabyte = 1024 * 1024; var oneMegabyte = 1024 * 1024;
@ -1669,7 +1664,7 @@ function drawMemoryUsage(elementId, machineInfo, containerInfo) {
data.push(elements); data.push(elements);
} }
// Updating the progress bar // Updating the progress bar.
var cur = containerInfo.stats[containerInfo.stats.length-1]; var cur = containerInfo.stats[containerInfo.stats.length-1];
var hotMemory = Math.floor((cur.memory.working_set * 100.0) / machineInfo.memory_capacity); var hotMemory = Math.floor((cur.memory.working_set * 100.0) / machineInfo.memory_capacity);
var totalMemory = Math.floor((cur.memory.usage * 100.0) / machineInfo.memory_capacity); var totalMemory = Math.floor((cur.memory.usage * 100.0) / machineInfo.memory_capacity);
@ -1739,7 +1734,6 @@ function drawFileSystemUsage(machineInfo, stats) {
var els = window.cadvisor.fsUsage.elements[data.device]; var els = window.cadvisor.fsUsage.elements[data.device];
els.progressElement.width(totalUsage + "%"); els.progressElement.width(totalUsage + "%");
els.textElement.text(humanized[0].toFixed(2) + " " + humanized[1] + " (" + totalUsage + "%)"); els.textElement.text(humanized[0].toFixed(2) + " " + humanized[1] + " (" + totalUsage + "%)");
} }
} }
@ -1772,6 +1766,7 @@ function startFileSystemUsage(elementId, machineInfo, stats) {
window.cadvisor.fsUsage.elements[data.device] = { window.cadvisor.fsUsage.elements[data.device] = {
'progressElement': progressElement, 'progressElement': progressElement,
'textElement': textElement, 'textElement': textElement,
'index': i,
}; };
} }
$("#" + elementId).empty().append(el); $("#" + elementId).empty().append(el);