如何在L.tileLayer的传单地图中使用localhost TileServer GL？

Question

我正在尝试使用Leaflet和Tileserver Gl制作离线地图

我正在尝试在我的应用程序中使用Tileing绘制地图的情况下加载Tileserver Gl tiles [哪个托管在我的斯里兰卡特定区域的本地系统中]。但是瓷砖没有加载，我无法弄清楚。将添加用于绘制我的地图的代码

使用以下代码在本地托管我的图块

npm install -g tileserver-gl-light
tileserver-gl-light sri_lanka.mbtiles

在线工作图

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

离线地图

哪个没有加载瓷砖

L.tileLayer('http://localhost:8080/data/v3/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

信息：我对传单和编程有点
陌生，在过去的两天里，我非常感激Thanx！

Answer 1

/data/v3TileServer GL Light 的端点不提供PNG图像图块，而是Protobuf（pbf）格式的矢量图块。

对于Leaflet，您将必须使用插件，Leaflet文档中列出了一些插件。在此GIS Stackexchange问​​题上可以找到更多建议和示例代码：如何在Leaflet地图中加载矢量图块层？。

仅“非轻型” TileServer GL具有“渲染图块”。如果您使用的是，则可以使用以下URL之一（提供的标准样式）访问图块：

http://localhost:8080/styles/klokantech-basic/{z}/{x}/{y}.png
http://localhost:8080/styles/osm-bright/{z}/{x}/{y}.png

启动TileServer GL后，您还将在http：// localhost：8080 /上找到它们。