198 lines
8.1 KiB
JavaScript
198 lines
8.1 KiB
JavaScript
google.charts.load('current', { 'packages': ['corechart'] });
|
|
google.charts.setOnLoadCallback(drawVisualization);
|
|
|
|
function drawVisualization() {
|
|
var data;
|
|
var deviceId = localStorage.getItem('deviceId');
|
|
if (deviceId === 'xAq9W1PO5rmAuuQ' || deviceId === 'wzI0R1JqWqV0Lyi') {
|
|
data = google.visualization.arrayToDataTable([
|
|
['Month', '', ''],
|
|
['BENIGN', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
['MSSQL', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
['Portmap', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
['UDP', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
['NetBIOS', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
['Syn', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
['UDPLag', getRandomInt(0, 0), getRandomInt(0, 0)],
|
|
]);
|
|
} else {
|
|
data = google.visualization.arrayToDataTable([
|
|
['Month', '', ''],
|
|
['BENIGN', 0, 0],
|
|
['MSSQL', 0, 0],
|
|
['Portmap', 0, 0],
|
|
['UDP', 0, 0],
|
|
['NetBIOS', 0, 0],
|
|
['Syn', 0, 0],
|
|
['UDPLag', 0, 0],
|
|
]);
|
|
}
|
|
|
|
var options = {
|
|
title: '',
|
|
vAxis: {
|
|
title: 'epoch',
|
|
viewWindow: {
|
|
min: 0,
|
|
}
|
|
},
|
|
hAxis: { title: 'DDoS type' },
|
|
seriesType: 'bars',
|
|
series: { 1: { type: 'line' } },
|
|
backgroundColor: '#0c212b',
|
|
tooltip: { trigger: 'none' },
|
|
colors: ['#2f6689', '#dd4477']
|
|
};
|
|
|
|
var chart = new google.visualization.ComboChart(document.getElementById('LineColumnsChart'));
|
|
chart.draw(data, options);
|
|
|
|
// Update data every 3 seconds
|
|
setInterval(function() {
|
|
fetch('fetch_ddos_value/')
|
|
.then(response => response.json())
|
|
.then(jsonData => {
|
|
var benignValue = 100;
|
|
|
|
// Check if any of the specified values are greater than 0
|
|
if (parseInt(jsonData.data['mysql.log'] || 0) > 0 ||
|
|
parseInt(jsonData.data['portmap.log'] || 0) > 0 ||
|
|
parseInt(jsonData.data['udp.log'] || 0) > 0 ||
|
|
parseInt(jsonData.data['netbios.log'] || 0) > 0 ||
|
|
parseInt(jsonData.data['syn.log'] || 0) > 0 ||
|
|
parseInt(jsonData.data['udplag.log'] || 0) > 0) {
|
|
benignValue = 0;
|
|
}
|
|
|
|
// Update bar chart values
|
|
data.setValue(0, 1, benignValue); // BENIGN
|
|
|
|
data.setValue(1, 1, truncateToThreeDigits(parseInt(jsonData.data['mysql.log'] || 0))); // MSSQL
|
|
data.setValue(2, 1, truncateToThreeDigits(parseInt(jsonData.data['portmap.log'] || 0))); // Portmap
|
|
data.setValue(3, 1, truncateToThreeDigits(parseInt(jsonData.data['udp.log'] || 0))); // UDP
|
|
data.setValue(4, 1, truncateToThreeDigits(parseInt(jsonData.data['netbios.log'] || 0))); // NetBIOS
|
|
data.setValue(5, 1, truncateToThreeDigits(parseInt(jsonData.data['syn.log'] || 0))); // Syn
|
|
data.setValue(6, 1, truncateToThreeDigits(parseInt(jsonData.data['udplag.log'] || 0))); // UDPLag
|
|
|
|
// Update line chart values
|
|
for (var i = 1; i <= 6; i++) {
|
|
var randomValue = getRandomInt(0, 0);
|
|
if (randomValue === 0) {
|
|
// Set line chart to null if bar chart is 0
|
|
data.setValue(i, 2, null);
|
|
} else {
|
|
// Otherwise update with random value
|
|
data.setValue(i, 2, randomValue);
|
|
}
|
|
}
|
|
|
|
chart.draw(data, options);
|
|
})
|
|
.catch(error => console.error('Error fetching data:', error));
|
|
}, 3000);
|
|
}
|
|
|
|
function truncateToThreeDigits(value) {
|
|
// Ensure value is an integer and limit to 3 digits
|
|
return parseInt(value.toString().slice(0, 3));
|
|
}
|
|
|
|
function getRandomInt(min, max) {
|
|
return Math.floor(Math.random() * (max - min + 1)) + min;
|
|
}
|
|
|
|
// google.charts.load('current', { 'packages': ['corechart'] });
|
|
// google.charts.setOnLoadCallback(drawVisualization);
|
|
|
|
// function drawVisualization() {
|
|
// var data;
|
|
// var deviceId = localStorage.getItem('deviceId');
|
|
// if (deviceId === 'xAq9W1PO5rmAuuQ' || deviceId === 'wzI0R1JqWqV0Lyi') {
|
|
// data = google.visualization.arrayToDataTable([
|
|
// ['Month', '', ''],
|
|
// ['BENIGN', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ['MSSQL', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ['Portmap', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ['UDP', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ['NetBIOS', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ['Syn', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ['UDPLag', getRandomInt(500, 800), getRandomInt(500, 800)],
|
|
// ]);
|
|
// } else {
|
|
// data = google.visualization.arrayToDataTable([
|
|
// ['Month', '', ''],
|
|
// ['BENIGN', 0, 0],
|
|
// ['MSSQL', 0, 0],
|
|
// ['Portmap', 0, 0],
|
|
// ['UDP', 0, 0],
|
|
// ['NetBIOS', 0, 0],
|
|
// ['Syn', 0, 0],
|
|
// ['UDPLag', 0, 0],
|
|
// ]);
|
|
// }
|
|
|
|
// var options = {
|
|
// title: '',
|
|
// vAxis: {
|
|
// title:'epoch',
|
|
// viewWindow: {
|
|
// min: 0,
|
|
// max: 500
|
|
// }
|
|
// },
|
|
// hAxis: { title: 'DDoS type' },
|
|
// seriesType: 'bars',
|
|
// series: { 1: { type: 'line' } },
|
|
// backgroundColor: '#0c212b',
|
|
// tooltip: { trigger: 'none' },
|
|
// colors: ['#2f6689', '#dd4477']
|
|
// };
|
|
|
|
// var chart = new google.visualization.ComboChart(document.getElementById('LineColumnsChart'));
|
|
// chart.draw(data, options);
|
|
|
|
// // Update data every second
|
|
// setInterval(function() {
|
|
// var deviceId = localStorage.getItem('deviceId');
|
|
// if (deviceId === 'xAq9W1PO5rmAuuQ' || deviceId === 'wzI0R1JqWqV0Lyi' ) {
|
|
// data.setValue(0, 1, getRandomInt(0, 500));
|
|
// data.setValue(0, 2, getRandomInt(0,100));
|
|
// data.setValue(1, 1, getRandomInt(0,100));
|
|
// data.setValue(1, 2, getRandomInt(0,100));
|
|
// data.setValue(2, 1, getRandomInt(0,100));
|
|
// data.setValue(2, 2, getRandomInt(0,100));
|
|
// data.setValue(3, 1, getRandomInt(0,100));
|
|
// data.setValue(3, 2, getRandomInt(0,100));
|
|
// data.setValue(4, 1, getRandomInt(0,100));
|
|
// data.setValue(4, 2, getRandomInt(0,100));
|
|
// data.setValue(5, 1, getRandomInt(0,100));
|
|
// data.setValue(5, 2, getRandomInt(0,10));
|
|
// data.setValue(6, 1, getRandomInt(0,10));
|
|
// data.setValue(6, 2, getRandomInt(0,10));
|
|
// chart.draw(data, options);
|
|
|
|
// } else {
|
|
// data.setValue(0, 1, getRandomInt(0,0));
|
|
// data.setValue(0, 2, getRandomInt(0,0));
|
|
// data.setValue(1, 1, getRandomInt(0,0));
|
|
// data.setValue(1, 2, getRandomInt(0,0));
|
|
// data.setValue(2, 1, getRandomInt(0,0));
|
|
// data.setValue(2, 2, getRandomInt(0,0));
|
|
// data.setValue(3, 1, getRandomInt(0,0));
|
|
// data.setValue(3, 2, getRandomInt(0,0));
|
|
// data.setValue(4, 1, getRandomInt(0,0));
|
|
// data.setValue(4, 2, getRandomInt(0,0));
|
|
// data.setValue(5, 1, getRandomInt(0,0));
|
|
// data.setValue(5, 2, getRandomInt(0,0));
|
|
// data.setValue(6, 1, getRandomInt(0,0));
|
|
// data.setValue(6, 2, getRandomInt(0,0));
|
|
// chart.draw(data, options);
|
|
|
|
// }
|
|
// }, 1000);
|
|
// }
|
|
|
|
// function getRandomInt(min, max) {
|
|
// return Math.floor(Math.random() * (max - min + 1)) + min;
|
|
// }
|