Clustering custom html markers with mapbox-gl-js

Question

I am using the mapbox-gl-js API and I am using it to respond to the creation of some custom tokens as follows:

let div = document.createElement('div'); let marker = new mapboxgl.Marker(div, { offset: [ -20, 80 ] }); marker.setLngLat(person.geometry.coordinates); render( <MapPersonIcon />, div, () => { marker.addTo(map); } ); 

It did a great job. However, now I would like to group these markers, creating the same effect as the functionality found with the layers, i.e.

https://www.mapbox.com/mapbox-gl-js/example/cluster/

Does anyone know if this is possible (hopefully with custom clusters) or will it be available in the upcoming version?

Answer 1

Answering your own question:

Currently it seems like this is not possible according to mapbox github:

If you want to group markers, you will need to use your own maki icons on the map (see sample image and URL) until the plugin is available for your own HTML markers.