Merge pull request 'Add local clustering' (#2468) from feature/local-clustering into develop

Reviewed-on: MapComplete/MapComplete#2468

src/Models/ThemeViewState/WithSpecialLayers.ts

@@ -18,9 +18,10 @@ import { Store, UIEventSource } from "../../Logic/UIEventSource"
 import NearbyFeatureSource from "../../Logic/FeatureSource/Sources/NearbyFeatureSource"
 import {
     SummaryTileSource,
-    SummaryTileSourceRewriter,
+    SummaryTileSourceRewriter
 } from "../../Logic/FeatureSource/TiledFeatureSource/SummaryTileSource"
 import { ShowDataLayerOptions } from "../../UI/Map/ShowDataLayerOptions"
+import { ClusterGrouping } from "../../Logic/FeatureSource/TiledFeatureSource/ClusteringFeatureSource"
 
 export class WithSpecialLayers extends WithChangesState {
     readonly favourites: FavouritesFeatureSource
@@ -63,6 +64,7 @@ export class WithSpecialLayers extends WithChangesState {
         this.closestFeatures.registerSource(this.favourites, "favourite")
 
         this.featureSummary = this.setupSummaryLayer()
+        this.setupClusterLayer()
         this.initActorsSpecialLayers()
         this.drawSelectedElement()
         this.drawSpecialLayers()
@@ -131,6 +133,18 @@ export class WithSpecialLayers extends WithChangesState {
         return source
     }
 
+    /**
+     * On high zoom levels, the clusters will be gathered in the GroupClustering.
+     * This method is responsible for drawing it
+     * @private
+     */
+    private setupClusterLayer(): void {
+        new ShowDataLayer(this.map, {
+            features: ClusterGrouping.singleton,
+            layer: new LayerConfig(<LayerConfigJson>(<unknown>summaryLayer), "summaryLayer")
+        })
+    }
+
     protected registerSpecialLayer(flayer: FilteredLayer, source: FeatureSource) {
         if (!source?.features) {
             return