TileSource with local tile file

Community Support
1

I am trying to display TMS Tile files from a local directory in Bokeh 2.2.3 (code is inline in Jupyter notebook for testing) but am not getting any image, just an empty plot.

The code I am using is as follows:

from bokeh.models.tiles import TMSTileSource, TileSource  
from bokeh.plotting import figure, show
from bokeh.io import output_notebook 
from bokeh.resources import INLINE
import bokeh.io
bokeh.io.output_notebook(INLINE)

p=figure(title = 'Slide Tile',  plot_height = 1024,  plot_width = 1024, 
       toolbar_location = 'right',  tools = 'pan, wheel_zoom, reset'  )

URL = 'http://localhost:8000/tiles/{z}/{x}/{y}.png'
### url is served by python3 -m http.server 8000 instantiated in parent dir of "tiles"

mytile = TMSTileSource(url=URL,tile_size=256, min_zoom=1, max_zoom=9, initial_resolution=512,
                       x_origin_offset=0, y_origin_offset=-86223 )

p.add_tile(mytile)
show(p)

This produces an empty plot.
Note: The tile file is valid and displays ok in many other js based Tile renderers
The note book is launched from the parent dir of the tile file

From the web console I get:

[bokeh] could not set initial ranges main.min.js:753:11995

Source map error: Error: request failed with status 404
Resource URL: http://localhost:8888/static/notebook/js/main.min.js?v=68936091b7b2dafbb368b29294028b02
Source Map URL: main.min.js.map

Any thoughts

2

Just as a contrast the following pasted into the same notebook but using holoviews and Bokeh does work which leaves me perplexed as to why the pure Bokeh version does not display?

import holoviews as hv
import bokeh.models.tiles
hv.extension('bokeh')

URL = 'http://localhost:8000/tiles/{Z}/{X}/{Y}.png'
hv.Tiles(bokeh.models.tiles.TMSTileSource(url=URL,tile_size=256, min_zoom=1, max_zoom=9, initial_resolution=512,
                       x_origin_offset=0, y_origin_offset=-86223 )).opts(width=600, height=600)
3

The first console message is a consequence (not a cause) of the tiles not loading (auto-ranging can’t work until there is data rendered to auto-range). The second console message is not from/related to Bokeh (messages about missing source map files are harmless in any case).

The best place to looks for clues is probably in the browser’s network tab, which will show all the individual network requests for the tiles and also any related status codes, errors, etc. The way browser dev tools are opened differs by browser, so you will have to google search how to access them for whatever specific browser you are using.

4

Thanks Bryan,

Really appreciate your input

I made a test TMS Tile file to use for testing here

I found I could somewhat display an image if I used the following parameters but it was very unstable with tiles mis-positioned.

p=figure(plot_height = 800,  plot_width = 800, x_range=(0, 180000), y_range=(0, 180000),
       toolbar_location = 'right',  tools = 'pan, wheel_zoom, reset', x_axis_type="linear", y_axis_type="linear")

URL = 'http://localhost:8000/tiles3/{Z}/{X}/{Y}.png'
### url is served by python3 -m http.server 8000 instantiated in parent dir of "tiles"

mytile = TMSTileSource(url=URL,wrap_around=False,tile_size=256, min_zoom=1, max_zoom=6,initial_resolution=2048, x_origin_offset=0, y_origin_offset=0)

in contrast the holoviews code above displayed the image just fine albeit in latlong and not xy!

Below is a screenshot of the output from Bokeh

I am probably just doing something wrong with the setup but it seems like the pure bokeh version is not handling the file correctly?

Screenshot of Bokeh output|514x500 .

Zooming this image (within the image area) in Bokeh causes the plot to dissapear off (shrink) into the top left hand corner.

Any suggestions for how I might make this code more robust?

Also I right in thinking that all tiles in Bokeh have a default of “raw mercator”?

5

@Assistedevolution there is a bug when zooming out too far (but only in that case) that causes the visual tearing issue. I’ve file [BUG] Tilerenderer snap_back path issue with setv · Issue #11061 · bokeh/bokeh · GitHub about it. For now you could probably set snap_back to False to avoid it.

Apart from that, I can’t say much. Your tile repo only seems to have level 6 tiles. When I run the code there is a ton of 404s trying to load tiles that don’t exist, and of course I have no way to know where to zoom in that might actually land on the few tiles that do exist. I am also not sure why it would work in Holoview since AFAIK Holoviews just uses Bokeh under the covers. I can only imagine it comes down to some configuration difference on the HV side but I don’t know what that might be. Perhaps @Philipp_Rudiger can comment.

6

@Bryan Thank you for taking a look at that, sorry multipart zip was probably not the best way to share:
Try this single zip https://drive.google.com/file/d/1xQb1c5DtYiRFlPlNUZqveC7BChFJpI1S/view?usp=sharing
There should be 2470 items and nothing in level 0 its a small tile files but it should display all the way through.