Implement Interactive Coverage Heatmaps #8

New issue

Open

opened 2025-08-24 18:16:58 +02:00 by olemd · 0 comments

olemd commented

2025-08-24 18:16:58 +02:00

Owner

Description

The Coverage view has a 'Toggle Heatmap' button but the actual heatmap visualization is not implemented.

Current Status

✅ Backend API endpoints work (/api/heatmap/{sourceId})
✅ Coverage points displayed as individual circles
❌ Heatmap overlay shows construction notice instead of visualization
❌ Missing Leaflet.heat library integration

Expected Functionality

Display signal strength as a colored heatmap overlay on the map
Smooth color gradients from red (weak) to green (strong)
Toggle on/off without affecting other map layers
Responsive to source selection changes
Proper integration with existing coverage data

Technical Requirements

Include Leaflet.heat library (https://github.com/Leaflet/Leaflet.heat)
Replace stub createHeatmapOverlay() function with actual implementation
Convert coverage API data to heatmap format
Add heatmap layer management to map controls

Files to Modify

assets/static/index.html - Add Leaflet.heat script include
assets/static/js/modules/map-manager.js - Implement createHeatmapOverlay()
Remove construction notice and enable proper heatmap rendering

This is a high-priority UX issue as users expect the heatmap toggle to work.

## Description The Coverage view has a 'Toggle Heatmap' button but the actual heatmap visualization is not implemented. ## Current Status - ✅ Backend API endpoints work (/api/heatmap/{sourceId}) - ✅ Coverage points displayed as individual circles - ❌ Heatmap overlay shows construction notice instead of visualization - ❌ Missing Leaflet.heat library integration ## Expected Functionality - Display signal strength as a colored heatmap overlay on the map - Smooth color gradients from red (weak) to green (strong) - Toggle on/off without affecting other map layers - Responsive to source selection changes - Proper integration with existing coverage data ## Technical Requirements - Include Leaflet.heat library (https://github.com/Leaflet/Leaflet.heat) - Replace stub createHeatmapOverlay() function with actual implementation - Convert coverage API data to heatmap format - Add heatmap layer management to map controls ## Files to Modify - assets/static/index.html - Add Leaflet.heat script include - assets/static/js/modules/map-manager.js - Implement createHeatmapOverlay() - Remove construction notice and enable proper heatmap rendering ## Related This is a high-priority UX issue as users expect the heatmap toggle to work.