2013-05-27 29 views
4

我從OpenStreetMap下載了一些圖塊(僅用於測試目的)。 然後,我使用幻想Leaflet javascript框架來查看交互式地圖,但是當我打開瀏覽器時,我會看到水平(Y)瓷磚圖像的顛倒順序。 這裏有什麼問題?我做錯了什麼?按倒序排列的地圖

這裏是我的代碼(很簡單):

<!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> 

而產生的圖像是這樣的(注意,行反轉)。該預期的結果是1,2,3排,並表明3,2,1:

Tiles showed with leaflet

任何幫助表示讚賞。

+2

你可以試一下'http://tile.osm.org/ {z}/{x}/{y} .png'網址嗎?如果一切看起來不錯,那麼你可能存儲錯誤的磁盤。 – tbicr

+0

@tbicr我也使用該網址,而且我仍然以反向順序獲取地圖,我是否使用傳單庫錯誤? –

回答

5

當我使用http://tile.osm.org/{z}/{x}/{y}.png時,問題仍然存在,所以我以正確的方式存儲瓷磚。 我只通過退出tms: true行解決了這個問題,我讀了很多教程用它來處理脫機地圖。 期待幫助別人。

+2

閱讀參考文獻(http://leafletjs.com/reference.html)說,如果tms是真的,反轉瓷磚的Y軸編號(爲TMS服務打開此項),所以如果將其設置爲true – Xavi

+0

@Xavi夠公平的,我檢查了2天后。請自由編輯答案。 –