如何在地图上使用本地图块

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 是一种称为“图块报废”的技术：确保它与图块源的使用条款兼容！

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

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