Offline maps using raster tiles

Dash Python
1

Hello,

I’m wondering if it’s possible to use a tile provider with plotly instead of mapbox.
I have to work offline, and have a local openstreetmap tiles server, I would like to use thos tiles to make a slippy map in a dash application. On this map I then want to overlay a scatter plot (with 10k+ points) and some polygons.
It is possible with Bokeh as explained here but I have not found a way to do it with plotly nor Dash.

Thanks for you help,

1 Like
2

@D.Ticien Thanks for your post. I am also looking to do this. Did you find a solution?

3

Hi,

Sorry for the late answer, I managed to do it, but with vector tiles, not raster tiles.
Apparently raster tiles support is ongoing but currently not supported by Dash.

If you’re interested in the vector tiles for an offline mode, here is how I managed to make it work :

  1. Have a tile server running, I used this docker image with OpenStreetMap mbtiles :

Docker image : https://hub.docker.com/r/klokantech/tileserver-gl/
OpenStreetMap Mbtiles files can easily be found on the web.

  1. As of Dash : In the layout of the Mapbox map :
  • Provide a dummy mapbox key (You don’t need an actual Mapbox key as you’re using your own tileserver, however, the mapbox key cannot be an empty string (I don’t know why though …)
  1. Finally, set the ‘style’ property of the layout to the GL style json URL.
    If you use Klokantech docker image : you can click on the GL Style button (see screenshot : https://openmaptiles.org/media/tileserver_gl_styles.png) and copy paste the link to the json file.

After those 3 steps, it should work like a charm!

4

Hey @D.Ticien, I know this is an old thread but havent found anything better yet, I am trying what you have suggested, running the docker image with the .mbtile files. Integrated it in my dash app as you suggested and gave some dummy string as well in the accesstoken.
The code works when I am connected to the internet and stops when I disconnect. Even though I dont see any network calls being made outside, why is it that maplayers are not coming?

fig.update_layout(
    mapbox=dict(
        style="http://[::]:8080/styles/basic-preview/style.json",
        accesstoken="dummystring",
        zoom=10,
    )
)