2017-07-19 105 views
0

所以我刚刚开始使用HTML不久前。一位朋友请我帮他建立一个网站。我们目前正在使用OSM瓷砖。一个问题是他想用另一种语言。所以他制作了瓷砖,我想在本地将瓷砖添加到网页中。换句话说,瓷砖在我的电脑上。即使有一百块,我也只能得到一块瓷砖。我将如何能够得到瓷砖如何添加本地瓷砖网站与小册子

<html> 
 
<head> 
 
    <title>A Leaflet map!</title> 
 
    <link rel="stylesheet" href="leaflet.css"/> 
 
    <script src="leaflet.js"></script> 
 
    <style> 
 
    #map{ height: 100% } 
 
    </style> 
 
</head> 
 
<body> 
 

 
    <div id="map"></div> 
 

 
    <script> 
 

 
    // initialize the map 
 
    var map = L.map('map').setView([45.8311111,-74.1992559], 16); 
 

 
    // load a tile layer 
 
    //I want to load multiple tile layers 
 
    L.tileLayer('file://C:/Users/Adam-PC/Documents/Map/Tiles1/18/77027/93433.png', 
 
    { 
 
     attribution: 'Tiles by <a href="https://www.openstreetmap.org">Open Street Map</a>, Data by <a href="https://www.openstreetmap.org">Open Street Map</a>', 
 
     maxZoom: 17, 
 
     minZoom: 9 
 
    }).addTo(map); 
 

 
    </script> 
 
</body> 
 
</html> 
 
\t

感谢您的帮助的休息!

回答

1

使用'file://C:/Users/Adam-PC/Documents/Map/Tiles1/{z}/{x}/{y}.png'而不是硬编码Tile Layer URL模板中的缩放,y和x值。

+0

它似乎仍然没有工作。我看到一个灰色的屏幕。是因为瓷砖在不同的文件夹中? –

+0

是的URL模板必须反映你的瓷砖如何存储/他们的文件夹结构。您可以使用浏览器的控制台查看调用的结果URL(并可能导致404错误) – ghybs

+0

感谢您的帮助。我可以通过更改缩放值来修复它。保持良好的工作 :) –