- 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
Pages Directory
This directory contains page-level components that represent different routes in the application.
Planned Pages
HomePage.tsx- Landing page with map viewReportPage.tsx- Report submission pageAnalyticsPage.tsx- Analytics dashboardEventsPage.tsx- Event listing and managementEventDetailPage.tsx- Individual event detailsProfilePage.tsx- User profile pageNotFoundPage.tsx- 404 error page