Leaflet.heat

To use the plugin, include the leaflet-heat.js file from the dist folder in your HTML file using a <script> tag. Ensure Leaflet is loaded before this plugin.

<script src="leaflet-heat.js"></script>

The options object for L.heatLayer accepts the following configuration keys:

• minOpacity: The minimum opacity the heat will start at.
• maxZoom: Zoom level where the points reach maximum intensity (intensity scales with zoom). Defaults to the map's maxZoom.
• max: Maximum point intensity. Defaults to 1.0.
• radius: Radius of each "point" of the heatmap. Defaults to 25.
• blur: Amount of blur. Defaults to 15.
• gradient: Color gradient configuration, e.g. {0.4: 'blue', 0.65: 'lime', 1: 'red'}.
• pane: Map pane where the heat will be drawn. Defaults to 'overlayPane'.

The heatmap layer instance provides several methods to update the data or visual configuration dynamically:

• setOptions(options): Sets new heatmap options and redraws the layer.
• addLatLng(latlng): Adds a new point to the heatmap and redraws it.
• setLatLngs(latlngs): Resets the heatmap with a new array of points and redraws it.
• redraw(): Manually triggers a redraw of the heatmap.

Use L.heatLayer(latlngs, options) to construct a heatmap layer.

Each point in the latlngs array can be an array in the format [lat, lng, intensity] or a Leaflet LatLng object. The third value (intensity/altitude) represents the point's weight. Unless the max option is specified, intensity should range between 0.0 and 1.0.

var heat = L.heatLayer([
	[50.5, 30.5, 0.2], // lat, lng, intensity
	[50.6, 30.4, 0.5],
	...
], {radius: 25}).addTo(map);