如何将局部瓦片用于地图

Question

我正在使用带有 openstreet 地图的 mapbox 来创建我的地图。但我想把瓷砖放在本地。从而减少流量和加载地图所需的时间。我正在使用 Mobile atlas creator MOBAC 获取 jpg 格式的图块，这是我通常使用的 HTML

var cities = new L.LayerGroup(); var mbAttr = 'Map data &copy; <a href="http://openstreetmap.org">OpenstreetMap</a> contributors, ' + '
<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="http://mapbox.com">Mapbox</a>', mbUrl = 'https://{s}.tiles.mapbox.com/v3/{id}/{z}/{x}/{y}.png'; var grayscale = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}',
{id: 'remote-sensing.n8k508ak', attribution: mbAttr, accessToken: 'pk.eyJ1IjoicmVtb3RlLXNlbnNpbmciLCJhIjoiYWNiYzg0ZWU2Mjk3ZTU5NjE4MmQyZWEzZTY2ZWNlYjIifQ.U7mp4MXdcjaIwW_syAqriQ'}) , streets = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}',
{id: 'remote-sensing.84f6c85a', attribution: mbAttr, accessToken: 'pk.eyJ1IjoicmVtb3RlLXNlbnNpbmciLCJhIjoiYWNiYzg0ZWU2Mjk3ZTU5NjE4MmQyZWEzZTY2ZWNlYjIifQ.U7mp4MXdcjaIwW_syAqriQ'});

关于如何做到这一点的任何想法。提前致谢

Answer 1

您的需求是一个常见的用例，一旦您在文件系统中的某处拥有切片，它就很容易实现，前提是它们仍然可以作为切片使用，坐标作为其文件名或访问路径的一部分.

使用 MOBAC 是一种称为 "tiles scrapping" 的技术：确保它与您的图块源的使用条款兼容！

最简单的解决方案是以保留路径结构的格式废弃您的图块。例如"OSMTracker tile storage"。它将为每个缩放级别创建一个文件夹，然后为每个 X 值创建一个文件夹，然后为每个 Y 值创建一个图块。

然后只需用您的文件夹结构替换您的 URL（L.tileLayer 的第一个参数）。假设您已将本地图块保存在与 HTML 页面相同的文件夹中，URL 将类似于 "{z}/{x}/{y}.png"。不再需要访问令牌。

如何将局部瓦片用于地图

How to use local tiles for map

html

gis

openstreetmap

leaflet

mapbox