I'm wondering if there are any principles or rules for when to "bake" geographic features into map tiles (e.g. using Mapbox Studio) versus when to "draw" them on dynamically (e.g. using Leaflet.js).

I'm not experienced with GIS or maps, but I do want to build beautiful, bespoke, functional maps for my web application to improve the user experience. i.e. every pixel is there for a reason, and when users click on something and expect to get a result, that happens. The challenge with that latter goal is that many things I'd expected to show on tiles are then non-interactive and maybe need to be pushed up to the leaflet layer instead.

As an example: Public transport stops, especially subway stations. I'd like to make them clickable in a similar way to Google Maps, i.e. clicking exposes a popup about the station as well as focuses attention on the subway lines that pass through it by thickening them. Currently we have non-interactive stops on our tiles, but now I'm realising I'd also need a Leaflet overlay to produce popups, so may as well draw the station icons themselves with Leaflet if I'm doing it that way anyway.

Afer this I assumed I surely can't be the only person to have faced the problem before and hoping those with more experience than I have found some good principles to follow. Is it as simple as "If the user wants to click on it then implement it with leaflet, otherwise bake it into the tiles?


I mostly agree with you and would say:

  • If the user wants to click on it => leaflet
  • If it changes regularly (like a GPS track) => leaflet
  • If it is loaded on demand => leaflet
  • if frontend rendering is too slow/complex => tiles

For interactivity, you may have another option, but I have never had the opportunity to play with that: UTF-grid


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.