MapBox Get a list of points by clicking on a cluster

Question

I am using Mapbox GL JS and getting cluster issues. I add several layers. I want to get a list of clustered points by clicking on a cluster.

map.on('click', function(e) {
    var cluster = map.queryRenderedFeatures(e.point, { layers: ["cluster"] });

    if (cluster.length) {
        // get clustered points here
        console.log(cluster[0]);
    }
});

An example of working with jsfiddle https://jsfiddle.net/L3hm8rur/

Answer 1

Unfortunately, the behavior you are looking for is not currently supported. The cluster level does not contain data for individual points in the cluster.

A workaround would be to filter out the GeoJSON source for points within your clusterRadiusdistance from the click point, and this will give you the points you are looking for.

JSFiddle: https://jsfiddle.net/aznkw784/

• - Mapbox

Answer 2

@mollymerp, supercluster getChildren(clusterId, clusterZoom), .

---

https://jsfiddle.net/denistsoi/bhzr6hpt/3/

- getLeaves, getChildren , ,

---

// GEOJSON being the valid geojson source
map.addSource('data', { 
   type: 'geojson', 
   data: [GEOJSON] 
}); 

map.on('click', function(e) {
  var cluster = map.queryRenderedFeatures(e.point, { layers: ["cluster"] });

  if (cluster.length) {
    // load values to determine cluster points & children

    var superc = supercluster({
       radius: 40,
       maxZoom: 16
    })

    superc.load(map.getSource('data').serialize().data.features);

    var children = superc.getChildren(0, map.getZoom());
    console.log(children); // returns array of children from clustered point;
  }
});