Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Heatmap layer manipulation #320

Open
JeffJway opened this issue Mar 18, 2020 · 1 comment
Open

Heatmap layer manipulation #320

JeffJway opened this issue Mar 18, 2020 · 1 comment

Comments

@JeffJway
Copy link

JeffJway commented Mar 18, 2020

Hi,

I may be missing the section in the documentation on these, but i am having a few problems and can't find out where to look for the answers.

First, after creating a instance of the heatmap

var stuff = {
"radius": 1,
"scaleRadius": true,
"useLocalExtrema": true,
latField: 'lat',
lngField: 'lng',
valueField: 'count'
};

var data = {
max: 10,
data:[{ lat: 5.102, lng: 85.112, count:5}, { lat: 5.202, lng: 85.312, count:5})]};

var heatmapLayer = new HeatmapOverlay(stuff);
heatmapLayer.setData(data);

map.addLayer(heatmapLayer);

One, later, calling
map.removeLayer(heatmapLayer);
does nothing at all. No errors, but the heatmaps are still there in the map. I want to hide the layer so the user can view the map without the heatmap obscuring, and also unhide it later without needing to recreate the heatmap. It's toggling through a leaflet button.

Two,
How do I remove the heatmap permanently (unlike hiding it above)? doing a setData([{}]) seems to create errors of invalid lat lng

Three,
I don't know if it's my map size or scaleRadius or useLocalExtrema, but I can't seem to create a very small heatmap to cover an area of about 100 meters radius. the smallest I can get is about a few kilometers in radius and sometimes i get errors like:
Failed to execute 'drawImage' on 'CanvasRendering Context2D': The image argument is a canvas element with a width or height of 0.

Lastly,
How do I later get a referrence to this heatmap object? Say I create the heatmap in my Main.js using
var heatmapLayer = new HeatmapOverlay(stuff);
How do i later referrence this Layer in , say a Leaflet or another Javascript file? I can't just get object by elementid, right?

Can anyone enlighten me?
Thanks

@taimoorh13
Copy link

Hello,
I am also trying to remove the heatmap layer using the code
map.removeLayer(heat);

But it does not seem to work. I get the following error when I try it.

Uncaught TypeError: Cannot read properties of undefined (reading '_leaflet_id')

And when I try to print out the layer using the console.log(heat); It gives me undefined.

In short, the layer is added properly to the map and I can see it. It also shows the data perfectly as expected. But when I try to remove the layer, it shows the error mentioned above. Is there any way I can solve this or am I missing something?

Any help will be appreciated!
Many Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants