feat: implement heat map visualization with Leaflet.heat plugin

- Integrate Leaflet.heat plugin for heat map overlay
- Add heat map toggle control in MapFilters component
- Configure heat map intensity based on report quantity levels (minimal: 0.3, moderate: 0.5, significant: 0.7, severe: 1.0)
- Implement heat map layer management with proper cleanup
- Add custom gradient colors (blue to red) for visual intensity representation
- Configure heat map with radius: 25px, blur: 15, maxZoom: 17
- Add TypeScript type declarations for leaflet.heat
- Heat map respects existing filter state (date range, litter type, quantity)

Implements task 5: Create heat map visualization
Requirements: 3.1, 3.5
This commit is contained in:
2025-11-16 16:05:31 +00:00
parent ba324b370e
commit 8f297e1ec4
5 changed files with 114 additions and 1 deletions

View File

@@ -32,7 +32,7 @@
- Implement filter state management and map updates
- _Requirements: 2.4, 2.5_
- [ ] 5. Create heat map visualization
- [-] 5. Create heat map visualization
- Integrate Leaflet.heat plugin
- Implement heat map toggle control
- Configure heat map intensity based on report density