diff --git a/dashboard/src/components/CpuUsage.vue b/dashboard/src/components/CpuUsage.vue index ed0e6c23a..845ac1037 100644 --- a/dashboard/src/components/CpuUsage.vue +++ b/dashboard/src/components/CpuUsage.vue @@ -15,8 +15,6 @@ async function refresh() { const [error, result] = await systemModel.graphs(period.value * 60); if (error) return console.error(error); - console.log(result.cpu); - const labels = result.cpu.map(v => { return moment(v[1]*1000).format('hh:mm:ss'); }); diff --git a/dashboard/src/components/MemoryUsage.vue b/dashboard/src/components/MemoryUsage.vue index 1a5ed0d6d..f5262ff94 100644 --- a/dashboard/src/components/MemoryUsage.vue +++ b/dashboard/src/components/MemoryUsage.vue @@ -21,38 +21,50 @@ async function refresh() { }); const data = result.memory.map(v => { - return v[0]; + return (v[0] / 1024 / 1024 / 1024).toFixed(2); }); - new Chart(graph.value, { - type: 'line', - data: { - labels, - datasets: [{ - label: 'Memory', - data: data, - radius: 0, - borderWidth: 1, - tension: 0.4, - }] + const giB = 1024 * 1024 * 1024; + const quarterGiB = 0.25 * giB; + const roundedMemory = Math.round(systemMemory.memory / quarterGiB) * quarterGiB; + const roundedMemoryGiB = (roundedMemory / giB).toFixed(2); + + const graphData = { + labels, + datasets: [{ + label: 'Memory', + data: data, + radius: 0, + borderWidth: 1, + tension: 0.4, + }] + }; + const options = { + plugins: { + legend: false }, - options: { - plugins: { - legend: false + scales: { + x: { + ticks: { autoSkipPadding: 50, maxRotation: 0 } }, - scales: { - y: { - min: 0, - max: systemMemory.memory / 1024 / 1024 + y: { + ticks: { maxTicksLimit: 6 }, + min: 0, + max: roundedMemoryGiB, + beginAtZero: true, + callback: (value) => { + return (value/1024).toLocaleString('en-US', { maximumFractionDigits: 6 }) + ' GiB'; } - }, - interaction: { - intersect: false, - mode: 'nearest', - axis: 'x' } + }, + interaction: { + intersect: false, + mode: 'nearest', + axis: 'x' } - }); + }; + + new Chart(graph.value, { type: 'line', data: graphData, options: options }); } onMounted(async () => {