I want to create an interactive map with a heatmap layer on it. The color should reflect a score which is calculated from the distance to coordinates. The coordinates are amenities (like public transport stop, supermarket, restaurant, playground) and the score should be an exponential decay function with different weights for each. The weights could be user-adjusted by a slider and grouped in categories.
Do similar projects already exist? What software recommended to use for it?
My idea was to first use Overpass turbo to collect POI data in a defined range (the above mentioned amenities). It itself has the option to visualize (with colors on the map at least).
Then one could use Leaflet.heat (Leaflet heatmap plugin) to visualize the calculate score dynamically in a web browser. But it seems this heatmap plugin does not properly interpolate between points when they are set on a grid. I'd calculate the score on a lat/lon grid.
Related https://www.reddit.com/r/gis/comments/px6lnu/using_leaflet_to_create_an_interactive_map/
There are generally two extreme ways in implementation:
First extreme is to let the server calculate and pre-process everything and return an overlay (like for TMS a tile with variable alpha value) that is defined for various zoom levels in defined bbox.
- Advantage: Simple implementation in Leaflet on the client side, and only the overlay tiles are loaded as needed.
- Disadvantage: fixed scores, need re-rendering when weights are adapted or new POIs are added
The other extreme is to let the client render and calculate everything: Just give the POIs and weights / distance-score function and the client calculates the scores on a grid and interpolates to get the desired heatmap.
- Advantage: very dynamic, fast adaption
- Disadvantage: client needs to render and calculate a lot (at every coord, which POIs to take into account, distance cutoff?)