Style tweaks - Circle radius was sqrt(point count), now is (point count)^(1/4). Rationale: Having the circle area represent the actual amount of points contained is not useful if this becomes huge; apply an exponent to scale these down to something reasonable. - Text labels were shown on clustered points; filter these out. The tiles pick an arbitrary representative point of the cluster, but we want to ignore these. - Add some text padding and variable text anchor. This should show fewer text labels at moderate zooms where they are just too crowded and slow down the map; it should show more text labels at high zooms where a small number of points are right on top of each other. # Please enter the commit message for your changes. Lines starting # with '#' will be ignored, and an empty message aborts the commit. # # On branch main # Your branch is up to date with 'origin/main'. # # Changes to be committed: # modified: docs/style.json # # Changes not staged for commit: # modified: docs/index.html # modified: docs/viewer.js # # Untracked files: # .gcloudignore # asdf # cloudbuild-buildonly.yaml # docs/carto.json # docs/toner.json # fgb.sh # output.geojsons # output.mbtiles # output.vrt # output.zip # run_id.txt # vrt.sh # # ------------------------ >8 ------------------------ # Do not modify or remove the line above. # Everything below it will be ignored. diff --git c/docs/style.json i/docs/style.json index 4b38966..ef5fa2e 100644 --- c/docs/style.json +++ i/docs/style.json @@ -31,32 +31,50 @@ "source-layer": "alltheplaces", "paint": { "circle-radius": [ - "interpolate", - [ - "exponential", - 2 - ], + "let", + "radius", [ - "zoom" - ], - 0, - 2, - 10, - ["*", + "*", 6, [ - "number", + "^", [ - "get", - "sqrt_point_count" + "number", + [ + "get", + "point_count" + ], + 1 ], - 1 + 0.25 ] ], - 14, - 10, - 22, - 50 + [ + "interpolate", + [ + "exponential", + 2 + ], + [ + "zoom" + ], + 0, + 10, + 6, + [ + "var", + "radius" + ], + 10, + [ + "var", + "radius" + ], + 14, + 10, + 22, + 50 + ] ], "circle-color": [ "case", @@ -79,6 +97,14 @@ "source": "alltheplaces", "source-layer": "alltheplaces", "minzoom": 11, + "filter": [ + "!=", + [ + "get", + "clustered" + ], + true + ], "layout": { "text-field": [ "get", @@ -87,7 +113,46 @@ "text-font": [ "Metropolis Regular" ], - "text-size": 10 + "text-size": 10, + "text-padding": [ + "interpolate", + [ + "exponential", + 2 + ], + [ + "zoom" + ], + 11, + 8, + 18, + 0 + ], + "text-justify": "auto", + "text-variable-anchor": [ + "top-left", + "center", + "bottom-right" + ], + "text-radial-offset": [ + "interpolate", + [ + "exponential", + 2 + ], + [ + "zoom" + ], + 11, + 0, + 18, + 1.5 + ] + }, + "paint": { + "text-halo-color": "#ffffee", + "text-halo-width": 1.25, + "text-halo-blur": 0.1 } } ]