This is a static archive of our old OpenStreetMap Help Site. Please post any new questions and answers at community.osm.org.

could anyone explain this to me … Leaflet

1
1

hello

I was using leaflet to get map from openstreet map and came across this.

http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png

could anyone explain it to me? I got the map but not in the right position and the right portion that i wanted

thank you

asked 20 Jun '12, 04:03

frensforall's gravatar image

frensforall
41223
accept rate: 0%

edited 24 Jun '12, 17:11

stephan75's gravatar image

stephan75
12.6k556210


3 Answers:

5

Leaflet displays a map by displaying a series of tiles across the page. It needs to know where to get these tiles from and how the tiles are stored in a directory structure. The statement you quote shows leaflet how the OSM tiles are structured. If you used tiles from another source the structure would be different.

Leaflet has fairly good documentation, the part describing how the tiles are structured is here: http://leaflet.cloudmade.com/reference.html#tilelayer

answered 20 Jun '12, 12:10

ChrisH's gravatar image

ChrisH
4.1k134262
accept rate: 15%

4

That line looks like the placeholder string for the url to the tiles that make up the standard layer. Leaflet will replace all the strings in curly braces '{}' to get the url for the tile it wants.

For instance http://b.tile.openstreetmap.org/8/127/85.png will give you a nice tile covering the south of england.

answered 20 Jun '12, 07:11

Gnonthgol's gravatar image

Gnonthgol ♦
13.8k16103198
accept rate: 16%

2

The tile layer definition has z, x, and y in it. They're replaced with actual values whenever Leaflet needs to fetch a tile. If you've got a working map, but it's centered on the wrong, you probably just need to tell Leaflet where to centre the map.

If you look at this example, you'll see that it contains:

map.setView(new L.LatLng(51.3, 0.7),9);

It's that function call that tells Leaflet where to centre the map and at what zoom level. If you replace "51.3" with the latitude you want, "0.7" with the longitude, and 9 with the zoom level, you'll get a map centred wherever you want it.

answered 20 Jun '12, 09:36

SomeoneElse's gravatar image

SomeoneElse ♦
36.9k71370866
accept rate: 16%

Source code available on GitHub .