manubb / Leaflet.PixiOverlay

Bring Pixi.js power to Leaflet maps
MIT License
463 stars 85 forks source link

Multiple Overlays #42

Open acycliq opened 4 years ago

acycliq commented 4 years ago

Thats a really nice piece of work but I got stuck with the following. If you wanted to have multiple pixiOverlays how would you do it please?

So, lets say for example in the demo with the French elections (demo.html) we want to filter per region (like Normandy, Brittany, Isle-de-France etc). What I tried is when I am parsing the raw data from the text file I am filtering out any data that do not meet the criteria, obtain a PixiLayer in the same way as in the demo and keep it in an array. I move then to the next region (lets say Brittany) and repeat the exact same loop again but feeding in data that come from Brittany and I get another PixiLayer. This new layer is then kept in the same array as the previous layer I repeat that for all regions and at the end I am looping over the array that keeps my PixiLayers and add each one to the map while at the same time I am also adding them to a L.control.Layer as follows:

var cl = L.control.layers(null, {}).addTo(map);
for (j = 0; j < myArray.length; j += 1) {
         var name = "Group " + j ;
         cl.addOverlay(myArray[j], name);
     }

While that works quite well for 2-3 overlays it gets too slow for more than 3 or 4. I guess that depends on the data too, (I have about 52000 polygons, the France demo has half as many. With 19 filters I had to use it was really slow)

Am I doing anything wrong in the whole plan here please?

PS1. Your France demo data do not have regions like Normandy etc, it just mentioned these just as an example. Maybe I should have used apartments instead

PS2. Very nice plugin, many thanks!