I still don't understand how the dots help when multiple dots need to be at the exact same coordinates at the lowest zoom level. How do you open a list of them?
I'm working on a project (using Protimaps and MapLibre, even, so this is very timely for me) where users create groups at physical locations. If 12 groups choose the local public library's schedulable meeting room as their meeting space, how would anyone click to see the list of groups that use that one room? Wouldn't I just end up with what looks like one very dark dot?
Point datasets have two distinct modes of visualization. First is an aggregate view which serves to show you the trends and spatial distribution. Second is the individual view showing details about the point itself, its attributes, etc.
Clustering (for all its faults) is the only off-the-shelf technique for seamlessly switching between these two modalities without having to change the underlying data representation. Need more detail? Zoom in. And the zoom level is adaptive so it works with any scale.
There are better aggregation techniques (summing to a hexagonal grid, heatmaps, etc) but they generally require a separate calculation (possibly server side) and then switching to the raw source for the individual point view, either manually or at some hardcoded zoom level. It's not the same experience - it feels like two separate map layers instead of one integrated clustered layer.
This is mostly a matter of what's available in the mapping libraries. You could imagine building an alternative to clustering that calculates a heatmap on the fly when zoomed out, eventually revealing points as you zoom in. But presently this is something you'd have to DIY. For now, clustering is the only thing that works right out of the box.
The clustered markers in leaflet are jarring (I like them, but when I show maps I make my wife she finds the transitions nauseating).
The default heatmaps for these maps are bad. Heatmaps should use filled contours so the gradations are more easily identified. (Continuous raster maps are blobby.) See the ascii glyph map in this post, https://andrewpwheeler.com/2015/06/12/favorite-maps-and-grap.... I think those should be static for various levels of zooms as well, and not recalibrated when zooming.
Another option (not shown here) is to just use polygons and aggregations, and when zoomed in can turn on that point layer (or just have it appear). Or can just make actual clusters (like DBSCAN).
Yeah, whatever approach to heatmaps was taken for the example in the article needed some work. It basically just turns into red when you zoom out. Whereas the opaque dots actually give you a nice sense of varying density.
The Atlas Obscura version of clustering seems especially bad. The presence of the cluster circles with unchanged numbers, even after zooming in, is just plain wrong.
I have seen some better clustering implementations, which give good sense for whats inside the cluster if you click on it.
Generally agree that the stacked individual points are a much better approach on modern hardware.
I have an app that is heavily map-based. It's an iOS app that uses Apple Maps (I know, I know, controversy, yadda, yadda; but there's a good reason -many of them, in fact- that I use Apple Maps).
I found that the built-in AM clustering truly sucks, so I wrote my own. It's not perfect, but delivers a much better experience than the native one.
I really enjoyed this article because it happens to focus on a problem I'm knee-deep in at the moment, although I'm not ready to throw clustering out the window just yet.
There's a deeper issue which the author touches on, showing too much information on a map. This is possible independent of technology limits depending on what level of focus you wish each point to have. For many maps, showing a bunch of small points is an elegant solution, the map turns into more of a data visualization. But a bunch of points tells you very little about a particular thing. It is rich in aggregated information and poor in specific information.
If Google Maps just gave you a bunch of points instead of labels, it would be less functional. Every city would just be a large collection of points. Great, that might be interesting if you want to visualize how the locations are distributed in the region, but you are probably looking at the map because you want to find a particular thing.
Clustering is the natural choice: show the most important thing out of all the points in the area. A label is important, a big circle with a number in it is the worst out all the options discussed. My issue with Google Maps is that there is no visual indicator that there are other points there, and that seems to be largely driven by the fact that it is a marketing platform.
I'm working on a map that uses a hybrid approach. Each map has a narrow focus and is tied to a particular community/interest: concerts, bear sightings, hostels, food trucks, whatever you want. For each point of focus, there is a label and a thumbnail. Showing a bunch of these all in the same place is a bad user experience, so it ranks them and shows the most important one, and the thumbnail is replaced by a number indicating there are other points of focus in the vicinity. Users can click on the item to get a side panel that shows a listing of all the points.
There are also other points on the map that are secondary to its focus, public transportation vehicles and other location points that the user can filter. These are displayed as little dots, similar to the example that the author provides. If you zoom in far enough, they become more than just dots.
In designing the user experience, I tried to make it like a map experience that you might find in a strategy game. Each focus point is like a unit that will bring up more information in a side panel. If there is more than one unit there, show an overview of the units. It's a work in progress, but I'm happy with the result so far.
WebGL is a major upgrade for maps. But as an old school web maps person, the obvious solution to the first problem (nearby points clustered even on the city level) is to use the maxZoom option which is in most clustering libraries.
It does save a purpose. For example in the OP's non-clustering example all of the Britain is covered in dots, I'm talking at the highest zoom level, while the Atlas Obscura version, the one that uses clustering, does a better job of providing data by mentioning how many points that general area contains.
In such cases I generally prefer displaying counts of points in defined areas, rather than using clustering (e.g., when zoomed out, show counts per country, and when zoomed in more show counts for states or equivalent sub-national areas).
If you have less than hundreds of thousands of points, you can probably get away with drawing individual dots on the map. Computer screens are high res.
It's technically feasible to just draw all the individual dots but it doesn't necessarily convey the information better.
When individual points are drawn close together, they're hard to discern without zooming right in. Even with additive opacity, they max out quite quickly once a couple of dots overlap.
Then, the dots should be less than 100% opacity, which helps convey density wherever they overlap. It's feasible in overpass turbo with its rather simplistic MapCSS, so it should be possible in proper web mapping libraries.
>You don’t have to cluster anymore. You can just be.
Try to get Google Maps or Apple Maps running on a phone with more than 200 Markers/Annotations, then come back to me with that. Their performance is fucking dreadful. Google Maps released a new renderer that just OOMs if you're rendering a Polyline with 5k segments. Decimate it or face consequences.
As far as I know, MapBox is about the only one that has tolerable performance. Anyone else doing heavy work and using the gmaps SDK is figuring out tricks: overlay rendering (drawing on a canvas above the map, which requires expensive RPC calls to get visible bounds / map projection which makes performance shit if you're not careful and always lags a frame behind), intense caching of marker descriptors, careful management of markers (dropping 200 Markers from scrolling the map + adding 200? Enjoy your main thread work that freezes the map), etc, etc.
> Try to get Google Maps or Apple Maps running on a phone with more than 200 Markers/Annotations
That the big tech version of this is pretty shit, should come as a surprise to no one. The OP's visualisation runs fine on my phone, presumably Google/Apple could do this too, if they were willing to spend a big of engineering time on it
I'm working on a project (using Protimaps and MapLibre, even, so this is very timely for me) where users create groups at physical locations. If 12 groups choose the local public library's schedulable meeting room as their meeting space, how would anyone click to see the list of groups that use that one room? Wouldn't I just end up with what looks like one very dark dot?
Clustering (for all its faults) is the only off-the-shelf technique for seamlessly switching between these two modalities without having to change the underlying data representation. Need more detail? Zoom in. And the zoom level is adaptive so it works with any scale.
There are better aggregation techniques (summing to a hexagonal grid, heatmaps, etc) but they generally require a separate calculation (possibly server side) and then switching to the raw source for the individual point view, either manually or at some hardcoded zoom level. It's not the same experience - it feels like two separate map layers instead of one integrated clustered layer.
This is mostly a matter of what's available in the mapping libraries. You could imagine building an alternative to clustering that calculates a heatmap on the fly when zoomed out, eventually revealing points as you zoom in. But presently this is something you'd have to DIY. For now, clustering is the only thing that works right out of the box.
The default heatmaps for these maps are bad. Heatmaps should use filled contours so the gradations are more easily identified. (Continuous raster maps are blobby.) See the ascii glyph map in this post, https://andrewpwheeler.com/2015/06/12/favorite-maps-and-grap.... I think those should be static for various levels of zooms as well, and not recalibrated when zooming.
Another option (not shown here) is to just use polygons and aggregations, and when zoomed in can turn on that point layer (or just have it appear). Or can just make actual clusters (like DBSCAN).
I have a map I made on my website that shows these (with various interaction tooltips/hover), https://crimede-coder.com/graphs/DurhamHotspots (hotspots of crime in Durham, NC). And an explanation of the cartographic decisions and when to use the different techniques, https://www.youtube.com/watch?v=mBm6sTR08BI
I have seen some better clustering implementations, which give good sense for whats inside the cluster if you click on it.
Generally agree that the stacked individual points are a much better approach on modern hardware.
I found that the built-in AM clustering truly sucks, so I wrote my own. It's not perfect, but delivers a much better experience than the native one.
There's a deeper issue which the author touches on, showing too much information on a map. This is possible independent of technology limits depending on what level of focus you wish each point to have. For many maps, showing a bunch of small points is an elegant solution, the map turns into more of a data visualization. But a bunch of points tells you very little about a particular thing. It is rich in aggregated information and poor in specific information.
If Google Maps just gave you a bunch of points instead of labels, it would be less functional. Every city would just be a large collection of points. Great, that might be interesting if you want to visualize how the locations are distributed in the region, but you are probably looking at the map because you want to find a particular thing.
Clustering is the natural choice: show the most important thing out of all the points in the area. A label is important, a big circle with a number in it is the worst out all the options discussed. My issue with Google Maps is that there is no visual indicator that there are other points there, and that seems to be largely driven by the fact that it is a marketing platform.
I'm working on a map that uses a hybrid approach. Each map has a narrow focus and is tied to a particular community/interest: concerts, bear sightings, hostels, food trucks, whatever you want. For each point of focus, there is a label and a thumbnail. Showing a bunch of these all in the same place is a bad user experience, so it ranks them and shows the most important one, and the thumbnail is replaced by a number indicating there are other points of focus in the vicinity. Users can click on the item to get a side panel that shows a listing of all the points.
There are also other points on the map that are secondary to its focus, public transportation vehicles and other location points that the user can filter. These are displayed as little dots, similar to the example that the author provides. If you zoom in far enough, they become more than just dots.
In designing the user experience, I tried to make it like a map experience that you might find in a strategy game. Each focus point is like a unit that will bring up more information in a side panel. If there is more than one unit there, show an overview of the units. It's a work in progress, but I'm happy with the result so far.
When individual points are drawn close together, they're hard to discern without zooming right in. Even with additive opacity, they max out quite quickly once a couple of dots overlap.
Try to get Google Maps or Apple Maps running on a phone with more than 200 Markers/Annotations, then come back to me with that. Their performance is fucking dreadful. Google Maps released a new renderer that just OOMs if you're rendering a Polyline with 5k segments. Decimate it or face consequences.
As far as I know, MapBox is about the only one that has tolerable performance. Anyone else doing heavy work and using the gmaps SDK is figuring out tricks: overlay rendering (drawing on a canvas above the map, which requires expensive RPC calls to get visible bounds / map projection which makes performance shit if you're not careful and always lags a frame behind), intense caching of marker descriptors, careful management of markers (dropping 200 Markers from scrolling the map + adding 200? Enjoy your main thread work that freezes the map), etc, etc.
First party map tools are absolute dog shit.
That the big tech version of this is pretty shit, should come as a surprise to no one. The OP's visualisation runs fine on my phone, presumably Google/Apple could do this too, if they were willing to spend a big of engineering time on it