In this recipe, we will create a heat map. A heat map usually visualizes the data range using a pseudo color, with the hotter colors being the higher values and the colder colors representing the lower range values.
The plugin we will use requires the data to be in a specific format, which is an array of [latitude, longitude, altitude]. It's unlikely that data in this format will be available from services, so first of all, the task is to enumerate through the actual data and format it as required.
Next, we have to create heatLayer
, which is provided by the Leaflet.heat plugin, pass the data and options, and add it to the map. We will perform the following steps in this recipe:
Start by opening the
chapter-4-example12- heat-starter
project and opening theindex.html
file. We need to import theleaflet-heat
plugin, so add the following line after the Mapbox.js scripts:<script src='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-heat/v0.1.3/leaflet...