I need to preload images (.png) / tiles in my own

source: new ol.source.XYZ

,which can it run fast to move and zoom in mobile devices.

I used ...libs/ol3/3.7.0/ol-debug.js and as urls: urlArray ..

var urlArray = ["/{z}/{x}/{y}.png"];

and tried following parameters to force pre-loading more images than default zoom of map : 'buffer','preload'; but nothink helped/worked. As first I minimize the size of every tile, but it helped not too much.

Can be helped to preload images/tiles throught CSS and

div.none {display:none;background-image:url()}

or exist any JS function to preload images from my folders /{z}/{x}/{y}.png ?

  • Are you developing an app for mobiles? – Jonatas Walker Aug 1 '15 at 9:23
  • No, Im developing single webside for mobile and desctop – THERimania THERimania Aug 1 '15 at 9:25

No, there isn't any JS or CSS function/setting that can do this. Nor Openlayers can. If you want to make things (move/zoom) faster, as I understand, the tiles (images) have to be cached on client side, in your case, each visitor (mobile) of your website.

Now, the only reasonable possibility is if you already know where your visitor is going to move, like a predetermined route. In this case, you could present a loading screen (or something else) while (under the screen) programmatically you move/zoom the map (this is caching the tiles).

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.