Add cpu load graph to UI.
This commit is contained in:
parent
667a8e0fd1
commit
a7603df953
@ -116,6 +116,8 @@ const containersHtmlTemplate = `
|
|||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
<h4>Total Usage</h4>
|
<h4>Total Usage</h4>
|
||||||
<div id="cpu-total-usage-chart"></div>
|
<div id="cpu-total-usage-chart"></div>
|
||||||
|
<h4>CPU Load Average</h4>
|
||||||
|
<div id="cpu-load-chart"></div>
|
||||||
<h4>Usage per Core</h4>
|
<h4>Usage per Core</h4>
|
||||||
<div id="cpu-per-core-usage-chart"></div>
|
<div id="cpu-per-core-usage-chart"></div>
|
||||||
<h4>Usage Breakdown</h4>
|
<h4>Usage Breakdown</h4>
|
||||||
|
@ -1471,6 +1471,11 @@ function drawLineChart(seriesTitles, data, elementId, unit) {
|
|||||||
position: 'bottom',
|
position: 'bottom',
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
// If the whole data series has the same value, try to center it in the chart.
|
||||||
|
if ( min == max) {
|
||||||
|
opts.vAxis.viewWindow.max = 1.1 * max
|
||||||
|
opts.vAxis.viewWindow.min = 0.9 * max
|
||||||
|
}
|
||||||
|
|
||||||
window.charts[elementId].draw(dataTable, opts);
|
window.charts[elementId].draw(dataTable, opts);
|
||||||
}
|
}
|
||||||
@ -1553,6 +1558,23 @@ function drawCpuTotalUsage(elementId, machineInfo, stats) {
|
|||||||
drawLineChart(titles, data, elementId, "Cores");
|
drawLineChart(titles, data, elementId, "Cores");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Draw the graph for CPU load.
|
||||||
|
function drawCpuLoad(elementId, machineInfo, stats) {
|
||||||
|
|
||||||
|
var titles = ["Time", "Average"];
|
||||||
|
var data = [];
|
||||||
|
for (var i = 1; i < stats.stats.length; i++) {
|
||||||
|
var cur = stats.stats[i];
|
||||||
|
|
||||||
|
var elements = [];
|
||||||
|
elements.push(cur.timestamp);
|
||||||
|
elements.push(cur.cpu.load_average/1000);
|
||||||
|
data.push(elements);
|
||||||
|
}
|
||||||
|
drawLineChart(titles, data, elementId, "Runnable threads");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// Draw the graph for per-core CPU usage.
|
// Draw the graph for per-core CPU usage.
|
||||||
function drawCpuPerCoreUsage(elementId, machineInfo, stats) {
|
function drawCpuPerCoreUsage(elementId, machineInfo, stats) {
|
||||||
if (stats.spec.has_cpu && !hasResource(stats, "cpu")) {
|
if (stats.spec.has_cpu && !hasResource(stats, "cpu")) {
|
||||||
@ -1829,6 +1851,9 @@ function drawCharts(machineInfo, containerInfo) {
|
|||||||
steps.push(function() {
|
steps.push(function() {
|
||||||
drawCpuTotalUsage("cpu-total-usage-chart", machineInfo, containerInfo);
|
drawCpuTotalUsage("cpu-total-usage-chart", machineInfo, containerInfo);
|
||||||
});
|
});
|
||||||
|
steps.push(function() {
|
||||||
|
drawCpuLoad("cpu-load-chart", machineInfo, containerInfo);
|
||||||
|
});
|
||||||
steps.push(function() {
|
steps.push(function() {
|
||||||
drawCpuPerCoreUsage("cpu-per-core-usage-chart", machineInfo, containerInfo);
|
drawCpuPerCoreUsage("cpu-per-core-usage-chart", machineInfo, containerInfo);
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user