Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
series: [{
name: 'Storage',
turboThreshold: 0,
data: this.hostData.history.map((entry) => {
return {
x: parseInt(moment.utc(entry.created_at).format('x')),
y: entry.totalstorage/1000/1000/1000,
};
}),
tooltip: { valueSuffix: ' GB' },
yAxis: 0,
color: (this.appMode !== "night-mode") ? "#0000ff":"#3cb6f1",
fillColor: {
stops: [
[0, Highcharts.Color((this.appMode !== "night-mode") ? "#0000ff":"#3cb6f1").setOpacity(0.3).get('rgba')],
[1, Highcharts.Color((this.appMode !== "night-mode") ? "#0000ff":"#3cb6f1").setOpacity(0).get('rgba')]
]
},
tooltip: { pointFormat: '<span style="color:blue">{series.name}: <b>{point.y:.2f} GB</b></span><br>' },
}, {
name: 'Used storage',
turboThreshold: 0,
data: this.hostData.history.map((entry) => {
return {
x: parseInt(moment.utc(entry.created_at).format('x')),
y: (entry.totalstorage-entry.remainingstorage)/1000/1000/1000
};
}),
tooltip: { valueSuffix: ' GB' },
yAxis: 2,
color: '#ff0000',
fillColor: {
legend: {
enabled: false
},
plotOptions: {
area: {
color: 'rgb(33, 206, 153)',
fillColor: {
linearGradient: {
x1: 0,
y1: 0,
x2: 0,
y2: 1
},
stops: [
[0, 'rgb(33, 206, 153)'],
[1, Highcharts.Color('rgb(33, 206, 153)').setOpacity(0).get('rgba')]
]
},
marker: {
radius: 2
},
lineWidth: 2,
states: {
hover: {
lineWidth: 3
}
},
threshold: null
}
},
series: [{
type: 'area',
]
},
tooltip: {
pointFormat: '<span style="color:#0069cb">{series.name}: <b>{point.y:.2f} TB</b></span><br>'
},
},
{
name: 'Used storage',
turboThreshold: 0,
data: this.used,
yAxis: 0,
color: '#00cba0',
fillColor: {
stops: [
[0, Highcharts.Color('#00cba0').setOpacity(0.3).get('rgba')],
[1, Highcharts.Color('#00cba0').setOpacity(0).get('rgba')]
]
},
tooltip: {
pointFormat: '<span style="color:#00cba0">{series.name}: <b>{point.y:.2f} TB</b></span><br>'
},
}
];
return options;
},
priceData() {
y: 55,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
},
plotOptions: {
area: {
fillColor: {
linearGradient: {
x1: 0,
y1: 0,
x2: 0,
y2: 1
},
stops: [
[0, Highcharts.getOptions().colors[0]],
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
]
},
marker: {
radius: 2
},
lineWidth: 1,
states: {
hover: {
lineWidth: 1
}
},
threshold: null
},
series:{
turboThreshold:5000//set it to a larger threshold, it is by default to render 1000 points
}
}, {
name: 'Used storage',
turboThreshold: 0,
data: this.hostData.history.map((entry) => {
return {
x: parseInt(moment.utc(entry.created_at).format('x')),
y: (entry.totalstorage-entry.remainingstorage)/1000/1000/1000
};
}),
tooltip: { valueSuffix: ' GB' },
yAxis: 2,
color: '#ff0000',
fillColor: {
stops: [
[0, Highcharts.Color('#ff0000').setOpacity(0.3).get('rgba')],
[1, Highcharts.Color('#ff0000').setOpacity(0).get('rgba')]
]
},
tooltip: { pointFormat: '<span style="color:red">{series.name}: <b>{point.y:.2f} GB</b></span><br>' },
}, {
name: 'Earnings',
turboThreshold: 0,
data: this.hostData.history.map((entry) => {
return {
x: parseInt(moment.utc(entry.created_at).format('x')),
y: ((entry.storageprice/1e12*4320)*((entry.totalstorage-entry.remainingstorage)/1000/1000/1000/1000))/30
};
}),
tooltip: { valueSuffix: ' SC/day' },
yAxis: 1,
color: '#00ff00',
fillColor: 'transparent',
colors: Highcharts.getOptions().colors.map(function (color) {
return {
radialGradient: {
cx: 0.4,
cy: 0.3,
r: 0.5
},
stops: [
[0, color],
[1, Highcharts.Color(color).brighten(-0.2).get('rgb')]
]
};
})
});
},
plotOptions: {
series: {
color: "white",
fillColor: {
linearGradient: [0, 0, 0, "100%"],
stops: [
[
0,
Highcharts.Color("#dbdae1")
.setOpacity(0.25)
.get("rgba")
],
[
0.5,
Highcharts.Color("#dbdae1")
.setOpacity(0.15)
.get("rgba")
],
[
1,
Highcharts.Color("#dbdae1")
.setOpacity(0)
.get("rgba")
]
]
}
}
},
legend: {
enabled: false
},