Clustering: build an array with clusterProperties

[antoinematyja]

Hello,

I am using the clustering feature and I would like to get on each cluster a property with an array of its clustered marker ids.

Looks like the best solution is to use the map/reduce options of Supercluster, which are kind of tunable using the clusterProperties parameter of the maplibre GL source:
https://maplibre.org/maplibre-gl-js-docs/style-spec/sources/#geojson-clusterProperties

However it seems like it is not possible to build an array: it relies on expressions which are translated into functions called in supercluster map/reduce, but there is no "accumulator" operator that builds an array.

I found nothing on this repository, but on mapbox-gl-js there is this issue:
mapbox/mapbox-gl-js#10695
Which was rejected by the author for some obscure reason (at least to me) – he probably missed use cases where this is useful.

I can think of 2 solutions:

• Add an "accumulator" operator to the expressions framework that allows to build an array
  This way the clustering code does not need any change

• Allow to provide directly map/reduce functions to clusterProperties (in addition to expressions), for example:

clusterProperties: {
  markerIds: {
    map: properties => properties.markerId,
    reduce: (accumulated, properties) => {
      accumulated.markerIds = accumulated.markerIds || []
      accumulated.markerIds.push(properties.markerId)
    }
  }
}

Let me know if I'm heading in the right direction 🙂

[HarelM]

Can you describe a use case from a user point of view? I'm having a hard time understanding the problem statement here.
Generally speaking, supercluster is a dependency of this library, so it might be more practical to open an issue/discussing there, maybe, IDK...

[antoinematyja]

Sure. My use case is to build a basic store locator: a list of stores next to a map displaying markers for each store (with clustering).
When the user selects a store in the list, I want to be able to trigger an animation on the marker on the map, and if the corresponding marker is clustered, the marker of the cluster should animate. So I need to know for each cluster if it contains the marker of my selected store.

[HarelM]

You can iterate through the cluster leaves, can't you?
Not sure I fully understand the problem statement.
You can look at https://israelhiking.osm.org.il where I implemented clustering which shows the cluster content when clicked, and shows a point of interest when zoom and clicked.

[antoinematyja]

Thanks for the example.
We first implemented the feature by calling getClusterLeaves on each cluster to find its markers. However the performance was not optimal as it calls the getLeaves method from supercluster, which itself calls recursively getChildren... We measured a ~40ms delay for this step with a small dataset on desktop.
It makes more sense to build this data during the clustering step since it already has this data during its process, it adds almost no computation.