web/satellite: make graph line more smooth
Made lines to be more smooth and also updates points styling Issue: https://github.com/storj/storj/issues/5826 Change-Id: I34229e772ceee5e48330f5662a584cd9dcd8c63d
This commit is contained in:
parent
511d74a76d
commit
73898e0d86
@ -82,7 +82,7 @@ const chartOptions = computed((): ChartOptions => {
|
||||
},
|
||||
elements: {
|
||||
line: {
|
||||
tension: 0,
|
||||
tension: 0.3,
|
||||
},
|
||||
},
|
||||
scales: {
|
||||
|
@ -54,26 +54,30 @@ const chartData = computed((): ChartData => {
|
||||
data: mainData,
|
||||
fill: true,
|
||||
backgroundColor: 'rgba(226, 220, 255, .3)',
|
||||
borderColor: '#c5baff',
|
||||
borderColor: '#7B61FF',
|
||||
pointHoverBackgroundColor: '#FFFFFF',
|
||||
pointBorderColor: '#c5baff',
|
||||
pointHoverBorderWidth: 4,
|
||||
radius: xAxisDateLabels.length === 1 ? 10 : 0,
|
||||
hoverRadius: 10,
|
||||
hitRadius: 8,
|
||||
pointBorderColor: '#7B61FF',
|
||||
pointHoverBorderWidth: 3,
|
||||
hoverRadius: 8,
|
||||
hitRadius: 3,
|
||||
pointRadius: 2,
|
||||
pointBorderWidth: 1,
|
||||
pointBackgroundColor: '#FFFFFF',
|
||||
order: 0,
|
||||
}, {
|
||||
data: secondaryData,
|
||||
fill: true,
|
||||
backgroundColor: 'rgba(226, 220, 255, .7)',
|
||||
borderColor: '#a18eff',
|
||||
borderColor: '#E2DCFF',
|
||||
pointHoverBackgroundColor: '#FFFFFF',
|
||||
pointBorderColor: '#a18eff',
|
||||
pointHoverBorderWidth: 4,
|
||||
radius: xAxisDateLabels.length === 1 ? 10 : 0,
|
||||
hoverRadius: 10,
|
||||
hitRadius: 8,
|
||||
order: 0,
|
||||
pointBorderColor: '#E2DCFF',
|
||||
pointHoverBorderWidth: 3,
|
||||
hoverRadius: 8,
|
||||
hitRadius: 3,
|
||||
pointRadius: 2,
|
||||
pointBorderWidth: 1,
|
||||
pointBackgroundColor: '#FFFFFF',
|
||||
order: 1,
|
||||
}],
|
||||
};
|
||||
});
|
||||
|
@ -51,13 +51,15 @@ const chartData = computed((): ChartData => {
|
||||
data,
|
||||
fill: true,
|
||||
backgroundColor: '#E6EDF7',
|
||||
borderColor: '#D7E8FF',
|
||||
borderColor: '#537CFF',
|
||||
pointHoverBackgroundColor: '#FFFFFF',
|
||||
pointBorderColor: '#003DC1',
|
||||
pointHoverBorderWidth: 4,
|
||||
radius: xAxisDateLabels.length === 1 ? 10 : 0,
|
||||
hoverRadius: 10,
|
||||
hitRadius: 8,
|
||||
pointBorderColor: '#537CFF',
|
||||
pointHoverBorderWidth: 3,
|
||||
hoverRadius: 8,
|
||||
hitRadius: 3,
|
||||
pointRadius: 2,
|
||||
pointBorderWidth: 1,
|
||||
pointBackgroundColor: '#FFFFFF',
|
||||
}],
|
||||
};
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user