search

Leaflet / Leaflet.heat

A tiny, simple and fast heatmap plugin for Leaflet.
http://leaflet.github.io/Leaflet.heat/demo
BSD 2-Clause "Simplified" License
1.55k stars 525 forks source link

Help with heatmap layer ordering #83

Open rodrigo-ferrao opened 7 years ago

rodrigo-ferrao commented 7 years ago

Hi, I am calling a GeoJSON points and extract the coords from it geometry as an array, with this array I create the heatmap. After that I call another Geojson, but polygon and the polygons are always drawn in top of my heatmap. How can I solve this problem?

I have tried to creat layergroups for each one of the layers and try to reorder them (by sendToFront(), sendToBack()), but nothings seems to solve my problem.

Zwabo commented 1 year ago

Hey!

The GeoJson Polygon and the Heatmap are both rendered inside the leaflet-overlay-pane per default. I inspected the map and found out that the svg element for rendering the polygon has a z-index of 200 while the canvas element that renders the heatmap only has a z-index of 100.

Manually setting the z-index of the canvas element to a higher value like 300 solved the problem for me.

Pedanfer commented 4 months ago

Yes, in fact that solves it!

.leaflet-map-pane canvas !important { z-index: 999; }

Thanks, @Zwabo. I was getting anxious with this. Now it makes sense that the svg element from leaflet is to draw the vectors but I had no idea why it was there previously, hehe.