Feature/interactive timeline heatmap

[Saranyadharani]

🔥 Feature: Interactive Timeline Heatmap with Drill-Down Visualization

Problem Statement

Current integrity delta charts show trends but lack granular timestamp inspection and pattern correlation, making it difficult for forensic analysts to identify tampering patterns efficiently.

Solution Implemented

Added an interactive forensic heatmap that visualizes anomaly patterns across hourly, daily, and weekly timeframes with drill-down capability.

---

✨ Key Features

1. Multi-View Heatmap

• Hourly View - 24-hour pattern visualization to identify peak anomaly times
• Daily View - 7-day pattern to spot weekday/weekend trends
• Weekly View - Week-over-week pattern detection for long-term analysis

2. Granularity Controls

• Toggle between Hourly/Daily/Weekly views with one click
• Active view highlighted with visual feedback

3. Interactive Drill-Down

• Click any heatmap cell to see detailed incident list
• Modal popup shows:
  • Incident number
  • Time range (start → end)
  • Duration in seconds
  • Severity level (Critical/Warning)
  • Additional details

4. Color-Coded Intensity

• Low (Blue) - Minor anomalies
• Medium (Orange) - Moderate anomalies
• High (Red) - Significant anomalies
• Critical (Dark Red) - Severe incidents

5. Hover Tooltips

• Shows time period and anomaly count on hover
• Non-intrusive, appears above the cell

---

📁 Files Modified/Added

File	Type	Description
styles/heatmap.css	New	Forensic-themed heatmap styling
js/visualization.js	New	Heatmap rendering and drill-down logic
html/dashboard.html	Modified	Added heatmap section with controls
js/dashboard.js	Modified	Integrated heatmap initialization

---

🧪 Testing Performed

• Heatmap appears after log analysis completes
• Hourly view shows 24 cells with correct anomaly counts
• Daily view shows 7 days with proper distribution
• Weekly view shows week-over-week patterns
• Clicking any cell opens drill-down modal
• Modal displays all incidents for selected time period
• Hover tooltips work correctly
• Color intensity scales with anomaly density
• Dark/Light theme compatibility
• Responsive on different screen sizes

---

📸 Visual Preview