I have a leaflet map of the UK with around ~2000 points total points and a bit of metadata loading for each point with two side-panels showing the metadata. These points are drawn from several tables stored in a PostGIS database on my own VPS. Now I’d like to add layers to display some standard demographics, i.e. census, index of multiple deprivation, etc. underneath the points. The trouble is, most of the spatial demographics for the UK are associated with census output areas (OAs) and the shapefile which includes all the UK OAs (for which I'm using the CDRC's excellent aggregated shapefile) is very large, around 250MB. This is only a technical problem, as I prefer maximal granularity for these polygons so OAs are good for this. But for this to work on the web, I need to find a way of reducing the amount of data being drawn from the server.
I’ve already tried generalising this shapefile in a series of ways (using postgis, qgis, and GRASS v.generalize - which are all some variation on Ramer–Douglas–Peucker method) but even pushing this to a level of generalisation that becomes unrecognisable gets me to around a 7mb toposjon file, which is way too big to work for the web. I expect that the same user map look at this map both at a National level (zoom level 9 or so) and on a local level (zoom level 13+) so need proper fidelity for the polygons but also need to be careful not to download hundreds of MB worth of unsimplified polygons when working with max zoom.
Going back to the drawing board, from what I can tell, there are three options:
Stick with geojson, but split my shapefile into a series of smaller geo/topojson files (but will need to also have a simplified national level geojson shapefile)
Import the .shp files into my PostGIS database and then have leaflet calculate bounding box for current leaflet map instance displayed onscreen using
map.getBounds();
then draw using PostGISST_MakeEnvelope()
to filter polygons returned by the query. Possibly also run the PostGIS SQL query throughST_Simplify()
if working with zoom level < 11 (or so)Set up a tileserver to serve pre-generated vector tiles (against using bounding box) proxied from my PostGIS database using something like Mapnik, T-Rex or Tilestache or load everything into GeoServer and serve using WMS.
I’ve scored the web and stackexchange and though most Q&A and tutorials are oriented towards working with a small geojson (usually a simplified map of the USA from Mike Bostock’s fantastic tutorials) there are a few overlapping but slightly different queries here:
- Visualizing large datasets of polygons with Leaflet
- Millions of polygons: displaying layers in Leaflet based on location being viewed?
- and more indirectly here: What is the most common way of displaying geodata from Postgis on Leaflet?
So what’s my best (i.e. most efficient) option? Is it one of the three above, or perhaps something else? The main concern here is to be sure that this leaflet map can load efficiently (without noticeable delay) across a range of zoom levels. I'm also a tad hesitant to implement a fully-featured tiling server unless this is the only feasible option. I'm hoping someone with experience setting up a similar solution can speak to the actual optimisation trade-offs (server overheads vs. client-side bandwidth) implicated in their preferred option.