Minor tweaks to charts appearance

Some charts had a more 'curvy' look to it. Adjusted this by using the
'tension' parameter.
Adjusted 'Utilization' pie chart aspect ratio so it is not so big.
pull/180/head
Guilherme Lima 2 years ago committed by Oliver Giles
parent 1be755e323
commit e25b58944d

@ -129,7 +129,8 @@ const Charts = (() => {
}] }]
}, },
options: { options: {
hover: { mode: null } hover: { mode: null },
aspectRatio: 2
} }
}); });
c.executorBusyChanged = busy => { c.executorBusyChanged = busy => {
@ -161,11 +162,13 @@ const Charts = (() => {
backgroundColor: "#883d3d", backgroundColor: "#883d3d",
data: data.map(e => e.failed || 0), data: data.map(e => e.failed || 0),
fill: true, fill: true,
tension: 0.35,
},{ },{
label: 'Successful Builds', label: 'Successful Builds',
backgroundColor: "#74af77", backgroundColor: "#74af77",
data: data.map(e => e.success || 0), data: data.map(e => e.success || 0),
fill: true, fill: true,
tension: 0.35,
}] }]
}, },
options:{ options:{
@ -279,7 +282,8 @@ const Charts = (() => {
label: name, label: name,
data: durations.map(x => x * scale.factor), data: durations.map(x => x * scale.factor),
borderColor: 'hsl('+(name.hashCode() % 360)+', 27%, 57%)', borderColor: 'hsl('+(name.hashCode() % 360)+', 27%, 57%)',
backgroundColor: 'transparent' backgroundColor: 'transparent',
tension: 0.35,
}); });
const c = new Chart(document.getElementById(id), { const c = new Chart(document.getElementById(id), {
type: 'line', type: 'line',
@ -389,7 +393,7 @@ const Charts = (() => {
})(); })();
// For all charts, set miniumum Y to 0 // For all charts, set miniumum Y to 0
Chart.defaults.scales.linear = { ticks: { suggestedMin: 0 } }; Chart.defaults.scales.linear.suggestedMin = 0;
// Don't display legend by default // Don't display legend by default
Chart.defaults.plugins.legend.display = false; Chart.defaults.plugins.legend.display = false;
// Disable tooltip hover animations // Disable tooltip hover animations

Loading…
Cancel
Save