Network Traffic Analysis Dashboard

Network Traffic Analysis Dashboard

Monitor and analyze real-time network traffic patterns and alerts.

Total Traffic

0 GB

Total Packets

0

Avg. Packet Size

0 KB

Active Alerts

0

Traffic Over Time (GB)

Traffic by Protocol

Geographical Traffic Source

Recent Alerts

Traffic Analysis Narrative

The dashboard analyzed ${totalVolumeGB.toFixed(2)} GB of traffic. The top source of traffic was ${topCountry[0]}, accounting for ${(topCountry[1]/1024).toFixed(2)} GB.

`; if (alerts.length > 0) { narrative += `

A total of ${alerts.length} alerts were triggered, with ${highAlerts} classified as high-severity. The most recent high-severity alert was for ${alerts.find(a => a.alert.includes('High'))?.alert || 'N/A'}.

`; } else { narrative += `

The network appears stable with no security alerts triggered during this period.

`; } narrativeContentEl.innerHTML = narrative; }; // --- EVENT HANDLERS --- if (dataForm) { dataForm.addEventListener('submit', function (e) { e.preventDefault(); const newEntry = { id: Date.now(), date: dataForm.date.value, country: dataForm.country.value, protocol: dataForm.protocol.value, volume: parseInt(dataForm.volume.value), packets: parseInt(dataForm.packets.value), alert: dataForm.alertType.value, }; trafficData.push(newEntry); dataForm.reset(); showTab('dashboard'); renderAll(); }); } window.deleteData = (id) => { trafficData = trafficData.filter(item => item.id !== id); renderAll(); }; if (pdfDownloadBtn) { pdfDownloadBtn.addEventListener('click', function () { const { jsPDF } = window.jspdf; const doc = new jsPDF({ orientation: 'landscape', unit: 'pt', format: 'a4' }); const contentToPrint = document.getElementById('dashboard-content'); if (!contentToPrint) return; const elementsToHide = contentToPrint.querySelectorAll('button'); elementsToHide.forEach(el => el.classList.add('pdf-hide')); html2canvas(contentToPrint, { scale: 2, useCORS: true, onclone: (doc) => { Chart.defaults.animation = false; } }) .then(canvas => { elementsToHide.forEach(el => el.classList.remove('pdf-hide')); Chart.defaults.animation = true; const imgData = canvas.toDataURL('image/png'); const imgProps = doc.getImageProperties(imgData); const pdfWidth = doc.internal.pageSize.getWidth() - 40; const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width; doc.text(`Network Traffic Analysis Report - ${new Date().toLocaleDateString()}`, 20, 20); doc.addImage(imgData, 'PNG', 20, 40, pdfWidth, pdfHeight); doc.save(`network-traffic-report.pdf`); }).catch(err => { elementsToHide.forEach(el => el.classList.remove('pdf-hide')); Chart.defaults.animation = true; console.error("PDF generation error:", err); }); }); } // --- INITIALIZATION --- renderAll(); showTab('dashboard'); });
Scroll to Top