Expose clustering in layoutConfig

This commit is contained in:
pietervdvn 2021-01-04 20:09:07 +01:00
parent 27f2206cae
commit c548c26158
7 changed files with 40 additions and 16 deletions

View file

@ -24,7 +24,9 @@ export default class LayoutConfig {
public readonly roamingRenderings: TagRenderingConfig[];
public readonly defaultBackgroundId?: string;
public readonly layers: LayerConfig[];
public readonly clustering: { };
public readonly clustering?: {
maxZoom: number
};
public readonly hideFromOverview: boolean;
public readonly enableUserBadge: boolean;
@ -76,22 +78,28 @@ export default class LayoutConfig {
);
this.defaultBackgroundId = json.defaultBackgroundId;
this.layers = json.layers.map((layer, i) => {
if (typeof layer === "string")
if (typeof layer === "string"){
if (SharedLayers.sharedLayers[layer] !== undefined) {
return SharedLayers.sharedLayers[layer];
} else {
throw "Unkown fixed layer " + layer;
}
}
return new LayerConfig(layer, this.roamingRenderings, `${this.id}.layers[${i}]`);
});
this.clustering = json.clustering ?? false;
this.clustering = undefined;
if(json.clustering){
this.clustering = {
maxZoom : json.clustering.maxZoom ?? 18
}
}
if(this.clustering){
for (const layer of this.layers) {
if(layer.wayHandling !== LayerConfig.WAYHANDLING_CENTER_ONLY){
throw "In order to allow clustering, every layer must be set to CENTER_ONLY";
console.error("WARNING: In order to allow clustering, every layer must be set to CENTER_ONLY. Layer", layer.id,"does not respect this for layout",this.id);
}
}
}

View file

@ -127,6 +127,9 @@ export interface LayoutConfigJson {
* If defined, data will be clustered.
*/
clustering: {
/**
* All zoom levels above 'maxzoom' are not clustered anymore
*/
maxZoom?: number
},

View file

@ -421,7 +421,9 @@ export class InitUiElements {
MetaTagging.addMetatags(features);
})
new ShowDataLayer(source.features, State.state.leafletMap, flayers);
new ShowDataLayer(source.features, State.state.leafletMap,
State.state.locationControl.map(l => l.zoom),
State.state.layoutToUse.data);
}

View file

@ -20,6 +20,7 @@ export default class ShowDataLayer {
constructor(features: UIEventSource<{ feature: any, freshness: Date }[]>,
leafletMap: UIEventSource<L.Map>,
zoom: UIEventSource<number>,
layoutToUse: LayoutConfig) {
this._leafletMap = leafletMap;
const self = this;
@ -41,11 +42,14 @@ export default class ShowDataLayer {
const feats = features.data.map(ff => ff.feature);
let geoLayer = self.CreateGeojsonLayer(feats)
const cl = window["L"];
const cluster = cl.markerClusterGroup();
cluster.addLayer(geoLayer);
geoLayer = cluster;
if (layoutToUse.clustering !== undefined) {
if (layoutToUse.clustering.maxZoom >= zoom.data) {
const cl = window["L"];
const cluster = cl.markerClusterGroup();
cluster.addLayer(geoLayer);
geoLayer = cluster;
}
}
if (oldGeoLayer) {
mp.removeLayer(oldGeoLayer);
@ -56,6 +60,9 @@ export default class ShowDataLayer {
features.addCallbackAndRun(() => update());
leafletMap.addCallback(() => update());
zoom.map(z => (layoutToUse.clustering?.maxZoom ?? 0) >= z).addCallback(() => {
update();
});
}

View file

@ -4,7 +4,7 @@
"nl": "Boom",
"en": "Tree"
},
"minzoom": 18,
"minzoom": 14,
"overpassTags": {
"and": ["natural=tree"]
},
@ -347,22 +347,23 @@
],
"hideUnderlayingFeaturesMinPercentage": 0,
"icon": {
"render": "./assets/themes/trees/unknown.svg",
"render": "circle:#ffffff;./assets/themes/trees/unknown.svg",
"mappings": [
{
"if": {
"and": ["leaf_type=broadleaved"]
},
"then": "./assets/themes/trees/broadleaved.svg"
"then": "circle:#ffffff;./assets/themes/trees/broadleaved.svg"
},
{
"if": {
"and": ["leaf_type=needleleaved"]
},
"then": "./assets/themes/trees/needleleaved.svg"
"then": "circle:#ffffff;./assets/themes/trees/needleleaved.svg"
}
]
},
"wayHandling": 1,
"width": {
"render": "8"
},

View file

@ -24,6 +24,9 @@
"startZoom": 8,
"widenFactor": 0.01,
"socialImage": "./assets/themes/trees/logo.svg",
"clustering": {
"maxZoom": 18
},
"layers": [
"tree_nodes"
],