Leaflet地图无法加载瓦片。

Question

Leaflet地图无法加载瓦片。

3

我的代码：

<!DOCTYPE html>
<html>
<head>
    <title>OpenTTD Map</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://npmcdn.com/leaflet@1.0.0-rc.3/dist/leaflet.css" />
    <script src="https://npmcdn.com/leaflet@1.0.0-rc.3/dist/leaflet.js"></script>
</head>
<body>
    <div id="map" style="width: 1600px; height: 900px"></div>
    <script>

        var tile_url = 'http://dev.ruun.nl/zelf/openttd/tiles/map_{x}_{y}.png';

        var map = L.map('map', {
          maxZoom: 20,
          minZoom: 20,
          crs: L.CRS.Simple
        }).setView([0, 0], 20);
        //65409x32839
        var southWest = map.unproject([0, 32839], map.getMaxZoom());
        var northEast = map.unproject([65409, 0], map.getMaxZoom());
        map.setMaxBounds(new L.LatLngBounds(southWest, northEast));
        L.tileLayer(tile_url, {
            attribution: 'Map data &copy; Ieuan\'s OpenTTD World',    
            continuousWorld: true,
            tileSize: 256
        }).addTo(map);

    </script>
</body>
</html>

由于某种原因，我的瓷砖没有加载，地图只显示灰色。它们没有被浏览器下载，并且我也没有收到任何错误消息。

这些瓷砖是一张 65409x32839 的截图的 256x256 部分。

查看的网址是 http://dev.ruun.nl/zelf/openttd/。

- Ieuan

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- ghybs · Accepted Answer

你需要明确指定你的瓷砖图层maxZoom选项为20，否则会得到默认值18，这将阻止你的瓷砖在你唯一的缩放级别（20）被调用。

演示：http://plnkr.co/edit/0654usix33JJ5HJ4EQT4?p=preview