$(function () {
var seriesColor = new Array();
var is_set = 0;
$('#cpu_mem_used').highcharts({
chart: {
zoomType: 'x',
backgroundColor: '#1d2132',
marginTop: 5,
marginBottom: 15,
marginLeft: 10,
marginRight: 0
},
title: {
text: null
},
subtitle: {
text: null
},
xAxis: {
type: 'category',
tickWidth: 0,
tickInterval: 55,
gridLineWidth: 1,
labels: {
align: 'center',
x: 0,
y: 12
},
},
yAxis: {
tickWidth: 0,
tickAmount: 3,
min: 0,
labels: {
align: 'left',
x: -3,
y: 10,
format: '{value:.,0f}'
},
title: {
text: null
},
showFirstLabel: false
},
legend: {
itemStyle: {
fontSize: '8pt',
fontWeight: 'normal',
},
floating: true,
align: 'right',
x: 15,
y: -17,
verticalAlign: 'top',
borderWidth: 0
},
plotOptions: {
area: {
fillColor: {
linearGradient: {
x1: 0,
y1: 70,
x2: 0,
y2: 0
},
stops: [
[0, Highcharts.getOptions().colors[0]],
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
]
},
marker: {
radius: 0
},
lineWidth: 2,
states: {
hover: {
lineWidth: 3
}
},
threshold: 'null'
},
series: {
type: 'area',
borderWidth: 0,
dataLabels: {
enabled: false,
format: '
{point.y:,.0f}
'
}
}
},
credits: {
enabled: false
},
navigation: {
buttonOptions: {
enabled: false
}
},
series: [{
type: 'area',
name: 'CPU',
lineWidth: 1,
data: []
},
{
type: 'area',
name: 'Memory',
lineWidth: 1,
data: []
}],
tooltip: {
shared: true,
crosshairs: true,
pointFormat: '{series.name} : {point.y:,.0f}%
',
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, 'rgba(96, 96, 96, .8)'],
[1, 'rgba(16, 16, 16, .8)']
]
},
borderWidth: 0,
style: {
color: '#FFF'
}
},
},
function(chart) {
setInterval(function refresh() {
var series_cpu = chart.series[0];
var series_mem = chart.series[1];
$.ajax({
url: './data/redstar_cpu_used_line.json',
dataType: 'json',
success: function(data) {
if (is_set[0] == 1) {
series_cpu.addPoint(eval(data[data.length - 1]), true, true);
}
if (is_set[0] != 1) {
series_cpu.setData(data);
is_set[0] = 1;
}
},
cache: false
}),
$.ajax({
url: './data/redstar_mem_used_line.json',
dataType: 'json',
success: function(data) {
if (is_set[1] == 1) {
series_mem.addPoint(eval(data[data.length - 1]), true, true);
}
if (is_set[1] != 1) {
series_mem.setData(data);
is_set[1] = 1;
}
},
cache: false
})
return refresh;
}(), 20000);
});
});