feat: implement hotspot visualization on map

- Add HotspotSeverity type and HotspotWithSeverity interface
- Implement getHotspots() method in analyticsService with severity calculation
- Add hotspot layer to MapView component with color-coded circles
- Create hotspot markers with severity icons and report count badges
- Add detailed hotspot popups showing report count, severity score, radius, and dates
- Implement hotspot toggle control in MapFilters with loading state
- Add hotspot severity legend to MapFilters
- Integrate hotspot data fetching in MapPage with sample fallback data
- Color-code hotspot boundaries: yellow (low), orange (medium/high), red (critical)
- Display hotspot statistics in interactive popups

Implements task 12: Create hotspot visualization
Requirements: 3.2, 3.3, 3.5
This commit is contained in:
2025-11-16 19:01:26 +00:00
parent 82635559db
commit 40a96142ba
6 changed files with 371 additions and 6 deletions

View File

@@ -83,7 +83,7 @@
- Create export to CSV functionality
- _Requirements: 5.1, 5.5_
- [x] 11. Implement data visualization charts
- [ ] 11. Implement data visualization charts
- Create time series chart for report trends
- Build pie chart for litter type distribution
- Implement comparison metrics with previous periods
@@ -91,7 +91,7 @@
- Configure chart responsiveness for mobile
- _Requirements: 5.2, 5.3, 5.4_
- [ ] 12. Create hotspot visualization
- [-] 12. Create hotspot visualization
- Fetch and display hotspot data on map
- Implement color-coded severity indicators
- Show hotspot boundaries and statistics