mapbox-gl-js
mapbox-gl-js copied to clipboard
Support clustering on vector tile data
Explanation
I'm fully aware we could use a geojson data source to accomplish this. Our datasets are large enough geographically that we would prefer to use tilesets instead if possible. We've found tilesets to be a much less bandwidth-intensive alternative for larger data sets like ours.
Mapbox is currently using their "supercluster" javascript plugin internally in the GL JS code in the browser. However, at the moment, it only works with a geojson data source. We would love that same functionality to be able to work with external tilesets (type: vector, tiles: ...) as well.
Reasoning
For now, we have implemented "supercluster" server-side as we write the tilesets to disk. We then read those in from the server and use clustering that way.
The problem with this approach is all about filtering. We can't really implement multiple filters on our data well with this approach. It works well for a single filter, but we want to be able to filter on multiple data points and server-side clustering does not work well for this approach.
Implementation
You already have a cluster: true option as part of addSource(). It only works with geojson sources is the issue. If you could allow it to work also with type: vector and tiles: [url] then my dream would be complete.
Thank you for your time and consideration.
I'd find this useful too.
A workaround at the moment could be querySourceFeatures for hidden vector tile features in the viewport followed by passing those to a client side geojson source with clustering for display. You'd get the advantages of serving data in vector tiles, but still get the visual benefits of clustering, while supporting custom filters.
Hey, what do you think about a object/array accumulation expression? all features will be clustered from server side like this structure
{
"type": "Feature",
"properties": {
features: [
{type: "A", category: 1, id:"123", category:1},
{type: "B", category: 2, id:"456", category: 2}
]
},
"geometry": {
"type": "Point",
"coordinates": [
8.906098487986396,
48.63653353027896
]
}
}
then filtering and coloring could be like this (to get all clusters which have type=A & category=2)
filter: ["accumulated"
["get", "features"],
["any", ["currentValue"],["accumulated"]],
["all",["=","A",["get","type"]],["=",2,["get","category"]]]
],
layout: {
text-field: [
"accumulated",
["get", "features"],
["+", ["currentValue"],["accumulated"]],
["case", ["all",["=","A",["get","type"]],["=",2,["get","category"]]], 1, 0]
]
}
That seems like it would work for our use case. Is this idea in development?
Peter @ UtahRealEstate.com
On Tue, Jul 20, 2021 at 4:36 AM Stephan Plänitz @.***> wrote:
Hey, what do you think about a object accumulation expression? all features will be clustered from server side like this structure
{ "type": "Feature", "properties": { features: [ {type: "A", category: 1, id:"123", category:1}, {type: "B", category: 2, id:"456", category: 2} ] }, "geometry": { "type": "Point", "coordinates": [ 8.906098487986396, 48.63653353027896 ] } }
then filtering and coloring could be like this (to get all clusters which have type=A & category=2)
filter: ["accumulated" ["get", "features"], ["any", ["currentValue"],["accumulated"]], ["all",["=","A",["get","type"]],["=",2,["get","category"]]] ], layout: { text-field: [ "accumulated", ["get", "features"], ["+", ["currentValue"],["accumulated"]], ["case", ["all",["=","A",["get","type"]],["=",2,["get","category"]]], 1, 0] ] }
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/mapbox/mapbox-gl-js/issues/10408#issuecomment-883287514, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABI4KGCHKP2VQYRMLDQMYGLTYVGRXANCNFSM4YC6KJGA .
-- Peter Y. Hammond @.***
still only a idea ;-)
@karimnaaji how to go on? can idea be a feature, do it need more discussion?
how is it going? are they any news here?