Heatmap from GeoJSON about leaflet.heat

[tayden]

I'm also interested in this

[sergei-maertens]

Yeah, me too

[ryankdalton]

This would be a great enhancement!

[brianrusso]

+1

[xuejinruan]

I am also looking for the support of GeoJson data for heatmap. If we could optionally choose any attribute field as weighting factor, that would be ever better! Thanks!!!

[mattesCZ]

I think this plugin should have as simple API as possible. You can always transform your GeoJSON data with simple function like this:

function geoJson2heat(geojson, intensity) {
  return geojson.features.map(function(feature) {
    return [
      feature.geometry.coordinates[0][1],
      feature.geometry.coordinates[0][0],
      feature.properties[intensity]
    ];
  });
}

[princeshahnawaz2012]

While using this function to fetch the data...I get this following error....
Uncaught RangeError: Maximum call stack size exceeded on leaflet.js:6

var geoData = geoJson2heat(layer.data, 2);
// returns 0: Array[3] 0: "42.3439925" 1: "-3.696906" 2: "4", 1: Array[3] 0: "38.2733071"1: "-3.6065861"2: "3" .....
var heatMap = L.heatLayer(geoData,{ radius: 20,blur: 15, maxZoom: 17})
map.addLayer(heatMap);

function geoJson2heat(geojson, intensity) {
return geojson.features.map(function(feature) {
return [
feature.geometry.coordinates[1],
feature.geometry.coordinates[0],
feature.properties[intensity]
];
});
}

[princeshahnawaz2012]

the main problem was double quotes in each array. Therefore, i did a tiny change(using parseFloat) in the same function and passing to directly L.heatLayer.. It seems working.

var geoData = geoJson2heat(layer.data, intensity);
var heatMap = new L.heatLayer(geoData,{radius: 30,blur: 15, maxZoom: 17});

geoJson2heat = function(geojson, intensity) {
return geojson.features.map(function(feature) {
return [parseFloat(feature.geometry.coordinates[1]), parseFloat(feature.geometry.coordinates[0]), intensity];
});
}

[mourner]

I agree with @mattesCZ, it should be easy enough to transform GeoJSON into a flat list of coordinates.

[Abhishek950650]

thankyou @ajgeers and @Jmuccigr i solved this issue
geoJson2heat = function(geojson) {
return geojson.features.map(function(feature) {
return [parseFloat(feature.geometry.coordinates[1]), parseFloat(feature.geometry.coordinates[0])];
});
}

function addObsToMap(obs, map) {
var geoData = geoJson2heat(obs, 1);
var heatMap = new L.heatLayer(geoData,{radius: 50, blur: 25, maxZoom: 17});
map.addLayer(heatMap);
}