$(function () { var seriesColor = new Array(); var is_set = 0; $('#traffic_eth1').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: 2 } }, 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: 'TX', lineWidth: 1, data: [] }, { type: 'area', name: 'RX', lineWidth: 1, data: [] }], tooltip: { shared: true, crosshairs: true, pointFormat: '{series.name} : {point.y:,.0f}Bytes
', 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_eth1_rx = chart.series[0]; var series_eth1_tx = chart.series[1]; $.ajax({ url: './data/redstar_eth1_network_bytes_tx.json', dataType: 'json', success: function(data) { if (is_set[0] == 1) { series_eth1_rx.addPoint(eval(data[data.length - 1]), true, true); } if (is_set[0] != 1) { series_eth1_rx.setData(data); is_set[0] = 1; } }, cache: false }), $.ajax({ url: './data/redstar_eth1_network_bytes_rx.json', dataType: 'json', success: function(data) { if (is_set[1] == 1) { series_eth1_tx.addPoint(eval(data[data.length - 1]), true, true); } if (is_set[1] != 1) { series_eth1_tx.setData(data); is_set[1] = 1; } }, cache: false }) return refresh; }(), 307000); }); });