JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2.rc.2/leaflet.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://unpkg.com/pixi.js@5.3.3/dist/pixi.js"></script>
<script src="https://cdn.jsdelivr.net/npm/leaflet-pixi-overlay@1.8.2/L.PixiOverlay.min.js"></script>
<button id='a' onclick='simulation.addTriangle()'>Add Triangle</button>
<button id='b' onclick='simulation.addImage2()'>Add Image 2</button>
<button id='c' onclick='simulation.removeLayer()'>remove all</button>
<div id="map"></div>

CSS

#map {
  height: 450px;
}

JavaScript

class Simulation
{
		constructor()
    {
              // center of the map
        var center = [1.8650,  51.2094];

        // Create the map
        this.map = L.map('map').setView(center, 2);

        // Set up the OSM layer
        L.tileLayer(
          'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            maxZoom: 18
          }).addTo(this.map);
        
        this.imagesLayer = new L.layerGroup(); 
        this.imagesLayer.addTo(this.map);
        
        
    }
    
    _getRandomCoord()
    {
    		var randLat = Math.floor(Math.random() * 90);
    		randLat *=  Math.round(Math.random()) ? 1 : -1;
    
        var randLon = Math.floor(Math.random() * 180);
        randLon *=  Math.round(Math.random()) ? 1 : -1;
        
        return [randLat,randLon]
    }
    
    addImage2()
    {
					
        this.loader = new PIXI.Loader()
        this.loader.add('hamster', 'https://cdn-icons-png.flaticon.com/512/196/196817.png')
      	this.loader.load((loader, resources) => {
        
            let markerTexture = resources.hamster.texture
            let markerLatLng = this._getRandomCoord()
            let marker = new PIXI.Sprite(markerTexture)
            marker.anchor.set(0.5, 1)

            let pixiContainer = new PIXI.Container()
            pixiContainer.addChild(marker)

            let firstDraw = true
            let prevZoom

            let pixiOverlay = L.pixiOverlay(utils => {
              let zoom = utils.getMap().getZoom()
              let container = utils.getContainer()
              let renderer = utils.getRenderer()
              let project = utils.latLngToLayerPoint
              let scale = utils.getScale()

              if (firstDraw) {
                let markerCoords = project(markerLatLng)
                marker.x = markerCoords.x
                marker.y = markerCoords.y
              }

              if (firstDraw || prevZoom !== zoom) {
                marker.scale.set(1 / scale)
              }

            ...