Threaded View

  1. #1
    Sencha User
    Join Date
    Aug 2011
    Vote Rating
    digeridoo will become famous soon enough digeridoo will become famous soon enough


    Default Answered: [Solved] Leaflet offline map graphical glitch with offline tiles


    After much fiddling and months of reading, I've come to the conclusion that Leaflet maps with Mapbox map layers is a great solution for an offline map (Mapbox has some of the best looking maps I have seen). It's not so bad to implement once you find a way of grabbing all the tiles from somewhere (or extracting the files from the .mbtiles archive, like I did).

    Anyway, I was wondering if anyone had any idea why, in my Leaflet tab of my Sencha Touch app, where I have a remote URL like this:

     var cloudmade = new L.TileLayer('http://{s}{z}/{x}/{y}.png', {
                maxZoom: 8
    The map displays perfectly:

    ...but when I reference it locally I get this:

    It seems like the tiles are there, but they are messed up. Any ideas why this might be happenening?


  2. Solved! Those nice guys over at Mapbox support replied with this:

    'mbutil exports tiles in TMS scheme, not XYZ. You can specify scheme: 'tms' in Leaflet to fix the error you're seeing'

    This is great, I can finally use Leaflet correctly with beautiful maps offline!