Preload tiles to avoid a whitespace

Progress® Kendo UI® for jQuery Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Unplanned

Last Updated: 15 Apr 2022 13:38 by ADMIN

archimede

Created on: 06 Apr 2022 07:17

Category: Map

Type: Feature Request

Preload tiles to avoid a whitespace

When users pan or zoom on map and the new tiles are not already downloaded (not already present in the layer) a momentary whitespace is displayed.
This behavior doesn't change if the tiles are saved in the browser cache.

A similar behavior present in the lower map of this page https://openlayers.org/en/latest/examples/preload.html
Is it possible to add the preload as in the upper map?
It would be enough to preload and add the tiles closest to those displayed by the user. Two more rows/columns of tiles above, below, left and right.

Attached Files:

map-without-preload.png

3 comments

ADMIN

Angel Petrov

Posted on: 15 Apr 2022 13:38

Hi,

When the page is reloaded indeed whitespaces can be present. If caching for preloading a page is the requirement we may consider some sort of solution. Thus I am marking this item as unplanned so we could examine it on a later stage.

Regards,
Angel Petrov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

archimede

Posted on: 12 Apr 2022 13:38

The browser cache doesn't help in avoiding the whitespaces. I'm caching all tiles using a service worker (Progressive Web App) and I have no change.

1) Load the page with the map

2) When you pan on a new area of map the new tiles are not already present in the layer. This lack causes a momentary whitespace is displayed.

3) If you go back to an already loaded area, this tiles are already present in the layer. The white is not visible.

4) If you reload the page and you return to the previously displayed areas then the momentary whitespaces will return. The tiles are not in the layer because the page is reloaded.

I have the same problem with the demo you linked. I have attached a screenshot.

The image always has the same urls, it is a standard. All tiles have the same structure:

https://[a,b,c].tile.openstreetmap.org/zoom/x/y.png (using OSM as example)
256x256 pixel
All the tiles are small in size, a few tens of KB. I have attached an example.

OpenStreetMap is a good guide for the topic https://wiki.openstreetmap.org/wiki/Slippy_map_tilenames

Attached Files:

ADMIN

Angel Petrov

Posted on: 12 Apr 2022 13:05

Hello,

Generally if the images are exactly the same as previously requested the browser cache should help in avoiding the whitespaces. I have tested this demo and zooming in/out using the +/- buttons and after the initial zoom everyhing loaded instantly. I suppose that on mobile devices the coordinates are slightly different and that is why the tile images are requested. I am not sure that preloading will work if the coordinates are different. Could you please ensure that identical tiles are requested?

Regards,
Angel Petrov
Progress Telerik