Interactively Display Values of a Heatmap.js leaflet.js Heatmap Layer

In this example of the heatmap.js tool, I see how the values of the heatmap is returned by using heatmapINstance.getValueAt():

  demoWrapper.onmousemove = function(ev) {
  var x = ev.layerX;
  var y = ev.layerY;
  // getValueAt gives us the value for a point p(x/y)
  var value = heatmapInstance.getValueAt({
    x: x,
    y: y
  }); = 'block';
  updateTooltip(x, y, value);

I also see that a heatmap instance is created, the “heatmapInstance” that we are using getValueAt() on:

var heatmapInstance = h337.create({
  container: document.querySelector('.heatmap'),
  // onExtremaChange will be called whenever there's a new maximum or minimum
  onExtremaChange: function(data) {

I’ve created a heatmap layer using heatmap.js’ (see picture below) leaflet-heatmap plugin, how could I display the value of my heatmap layer at the cursor location?
enter image description here

Geographic Information Systems Asked on December 8, 2021

1 Answers

One Answer

The heatmap display part. I use Leaflet v 1.4.0

var map ='map'); // this is your Leaflet map element; add your init options
lyrHEAT = new HeatmapOverlay(cfg).addTo(map);
lyrHEAT['overlayPane'] = 'heatPane'; // this is critical (I can explain more if needed)

The value display part

var heatPane = map.getPanes('heatPane').overlayPane; // access the canvas
// now, use mousemove on pane; the leaflet map.on("mousemove", function (e){}) won't help
heatPane.onmousemove = function (e) { 
var display_val = lyrHEAT._heatmap.getValueAt({
    x: e.layerX,
    y: e.layerY
 // display wherever you like the 'display_val' parameter, either as tooltip or in a div


Answered by PDash on December 8, 2021

Add your own answers!

Related Questions

OpenLayers zoom on a collection of points

1  Asked on June 14, 2021 by jnewman


Re-ordering layers before exporting to web map?

2  Asked on June 14, 2021 by jerry-johnson


QGIS NetCDF loaded upside down

0  Asked on June 14, 2021 by tbc


Loading GeoJSON in OpenLayers?

1  Asked on June 14, 2021 by matixcraft-matixcraft


ArcGIS Pro freezes when using Measure tool

0  Asked on June 13, 2021 by arvicola


Button on click does not display pie charts

1  Asked on June 13, 2021 by dilettante


Ask a Question

Get help from others!

© 2022 All rights reserved.