⚡ Straight to the demo

Ever since I have seen the Deck.gl-raster release announcement, I have been meaning to try it out, and now I finally got around to it.

Raster reprojection in the browser

Deck.gl-raster is only a few months old, but the idea of reprojecting rasters in the browser is not new. Notable previous examples are OpenLayers and Arrugator. However, the combination with Deck.gl (and therefore also MapLibre, since Deck.gl integrates with it) promises a more convenient usage in mainstream web mapping.

Choosing test data

For my little test run, an obvious choice for me was a map from Swisstopo’s Data Catalog, specifically the National Map 1:1 million, which covers all of Switzerland in a single map.

Making it render well

Starting from deck.gl-raster’s basic example, I added the URL to my chosen map, and it rendered like this:

Swisstopo GeoTIFF: Initial render

All maps © Swisstopo

Then I added a 2x fudge factor in order to get a higher level of detail (LOD), meaning that more pixels are loaded to get a more detailed rendering:

Swisstopo GeoTIFF: Higher LOD

Then I noticed that the map appeared darker than usual, so I had to disable some lighting computation in the rendering pipeline (this has been fixed in the meantime):

Swisstopo GeoTIFF: Avoid darkening

Finally, I had to change the texture settings to enable antialiasing to make the appearance smoother:

Swisstopo GeoTIFF: Add antialiasing

Now it looks exactly like I had expected. I added a toggle to overlay Swisstopo Web Mercator tiles of the same map, which has almost no effect now, because the rendering looks very similar. I think the browser-reprojected base map looks slightly sharper because it only goes through one resampling step, while the tiles are resampled twice (reproject to Web Mercator, then up-/downsample to match current map zoom).

You can ⚡ head to the demo and see for yourself.

Closing thoughts

This specific example may not appear very useful because it is reproducing existing functionality, namely reprojecting a raster map to Web Mercator. On the flip side, this allowed me to focus on the details and iron out a few glitches with this new library. Other interesting things to try in the future could be:

  • Rendering multiple GeoTIFFs à la stac-map.
  • Using raster tiles instead of a GeoTIFF as a source for the reprojection pipeline.
  • Once deck.gl-raster has matured a bit more, it should be possible to build a similar demo with a much simpler setup, just linking the library, rather than tweaking in a forked custom build.