How to add "click" listener on marker in mapbox-gl-js

Question

I added few markers on the map using folowing this example:

https://www.mapbox.com/mapbox-gl-js/example/geojson-markers/

Now I want to show popup when user clicks on marker image, but i can not find elegant solution. Any help?

Answer 1

I also had the same problem but I found a workaround without having to create an html element.

I Used getElement() function that return Marker like a HTML Element and after i attach the click event.

      this.service.getAllData().forEach(e => {         // create MapBox Marker         const marker = new mapboxgl.Marker().setLngLat([e.lon, e.lat]).addTo(this.map);         // use GetElement to get HTML Element from marker and add event         marker.getElement().addEventListener('click', () => {           alert("Clicked");         });       });