4

I download a few tiles from OpenStreetMap (only for testing purpose). Then i use the fantastical Leaflet javascript framework to view the interactive map, but when i open the browser i see the horizontal (Y) tiles images in inverted order. What's the problem here ?? I'm doing something wrong ??

Here is my code (is simple enough):

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <link rel="stylesheet" href="css/core.css" /> 
    <link rel="stylesheet" href="css/leaflet.css" /> 
    <script src="js/leaflet.js"></script>
</head>
<body>
<div id="map"></div>

<script>
    var map = L.map('map').setView([-23.13, -82.38], 14);
    L.tileLayer('tiles/{z}/{x}/{y}.png', {
        minZoom: 12,
        maxZoom: 16,
        attribution: 'SampleMap',
        tms: true
    }).addTo(map);
</script>
</body>
</html>

And the resulting image is this (note that the rows are inverted). The expecting result is row 1,2,3 and are showed 3,2,1:

Tiles showed with leaflet

Any help appreciated.

2
  • 2
    Can you try example with http://tile.osm.org/{z}/{x}/{y}.png url? If all will look good then probably you storing tiles wrong.
    – tbicr
    May 28, 2013 at 6:20
  • @tbicr I use that url too, and still i'm getting the maps in inversed order, am i using the leaflet library wrong ?? May 28, 2013 at 17:45

1 Answer 1

5

The problem persist when i use http://tile.osm.org/{z}/{x}/{y}.png, so i'm storing the tiles in the right way. I solve the problem only by quitting the tms: true line, i read a lot of tutorials using it to process off-line maps. Expect that helps to someone else.

2
  • 2
    Reading the reference (leafletjs.com/reference.html) says that if tms is true, inverses Y axis numbering for tiles (turn this on for TMS services), so its actually working as intended if you set it to true
    – Xavi
    May 29, 2013 at 6:53
  • @Xavi Fair enough, i check that 2 days after. Please be free to edit the answer. May 30, 2013 at 15:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.