Leaflet.PixiOverlay

Leaflet.PixiOverlay copied to clipboard

Not an issue, but this may help somebody.

I was having some problems using Vue3 with pixi layer, but have overcome them, so anybody else using Vue may be interested.

The pure Javascript demos have a document.addEventListener("DOMContentLoaded", event handler, so pixis are drawn after loading.

With Vue, I had two methods. One to draw the basic map, and load textures, and another to draw the pixels.

Then, after drawing the map, I used nexttick to draw the pixels.

nexttick is a very useful Vue function which waits until the next time the DOM is loaded. It replaces the DOMContentLoaded event.

More advice. Make the Vue very 'light'. Use javascript variables rather than Vue properties, for example do not have a Vue property for the map, using a plain Javascript variable.

I tore my hair out for several days until I moved some properties to Javascript variables.