From 3a52c22382911254e0254e21bf4709abba9be840 Mon Sep 17 00:00:00 2001 From: Will Freeman Date: Tue, 24 Dec 2024 12:51:37 -0800 Subject: [PATCH] marker clustering improvements --- webapp/src/components/LeafletMap.vue | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/webapp/src/components/LeafletMap.vue b/webapp/src/components/LeafletMap.vue index ad94465..2e45b63 100644 --- a/webapp/src/components/LeafletMap.vue +++ b/webapp/src/components/LeafletMap.vue @@ -100,20 +100,28 @@ function populateMap() { map.removeLayer(clusterLayer); } - clusterLayer = L.markerClusterGroup(); + clusterLayer = L.markerClusterGroup({ + chunkedLoading: true, + chunkProgress: () => {}, // update progress bar! + disableClusteringAtZoom: 16, // TODO: should probably match the ShowFOV threshold + removeOutsideVisibleBounds: true, + }); circlesLayer = L.featureGroup(); for (const alpr of props.alprs) { const { lat, lon: lng } = alpr; - const orientationDegrees = alpr.tags?.direction || 0; // TODO: make sure this works with nodes w/o orientation + const orientationDegrees = alpr.tags.direction; // TODO: make sure this works with nodes w/o orientation let marker: L.CircleMarker | L.Marker; // content of @/public/map-icon.svg; TODO: import it here if possible + const fovPath = ` + + + `; const svgMarker = ` - - + ${orientationDegrees ? fovPath : ''}