Creating and removing shapes doesnt remove the WebGL Context

[jackbarrie1341]

I have thousands of polygons i am rendering, and i need to be able to show/hide them and also update the opacity of them. Currently i am creating them any time an update needs to happen like this:
let glifyPolygons = glify.shapes({ map: map, data: colouredGrids, click: (e: any, feature: GeoJSON.Feature) => { handleGridClick(feature); }, color: (index: any, shape: any) => hexToRgb(shape.properties.color, transparency[0] / 100), });
Then any time a i need to hide or change the opacity, i remove it:
glifyPolygons.remove()
then redraw the polygons with the new opacity. However when i show/hide the polygons alot or update the opacity too frequently I get a warning in the console:

WARNING: Too many active WebGL contexts. Oldest context will be lost.

Then other shapes i am drawing with glify start to be deleted. It seems like the WebGL contexts arent being removed. I found a quick solution to show/hide by doing this:
if (layer && !state) { layer.remove(); } else if (layer && state) { layer.addTo(map); }
but the polygon data can also change so i need to be able to create new shape objects.
How can i fix this?

[trafficonese]

duplicate of #24 ?
related to #67

[charlieforward9]

@jackbarrie1341 as indicated above, this is a duplicate, so I will close it to keep the issue list clean.

Check out this hook I made to streamline the updating of your glify layers.