如何防止传单加载地图区域外的图块?
How to prevent leaflet from loading tiles outside map area?
我有一张 8576x8576 的地图,但我不断收到控制台错误:
Failed to load resource: net::ERR_FILE_NOT_FOUND
因为传单正在尝试加载不存在的图块。
我设置了边界和 MaxBounds 以防止在地图区域外平移(以将地图保持在屏幕中央)。
var map = L.map('map', {
maxZoom: mapMaxZoom,
minZoom: mapMinZoom,
zoomControl: false,
crs: L.CRS.MySimple
}).setView([0, 0], 3);
L.tileLayer('assets/map/{z}_{x}_{y}.jpg', {
minZoom: mapMinZoom,
maxZoom: mapMaxZoom,
tileSize: 268,
noWrap: true,
reuseTiles: true,
tms: false,
bounds: mybounds,
errorTileUrl: "assets/map/404.jpg",
continuousWorld: true
}).addTo(map);
new L.Control.Zoom({position: 'topright'}).addTo(map);
var sidebar = L.control.sidebar('sidebar').addTo(map);
var mybounds = [[-8576 / 2, -8576 / 2],[8576 / 2, 8576 / 2]];
map.setMaxBounds([[-5600, -5600], [5600, 5600]]);
我做错了什么?为什么 leaflet 不断尝试加载这些图块?
我试过这样设置 MaxBounds:
map.setMaxBounds([[-8576 / 2, -8576 / 2],[8576 / 2, 8576 / 2]]);
仍然会出现这些错误。
您需要在创建 tilelayer
之前定义 mybounds
。如果您的边界恰好位于图块的边缘,您可能还需要将边界稍微拉近一点,以防止地图尝试加载相邻的图块。以下是 OSM 磁贴的示例:
我有一张 8576x8576 的地图,但我不断收到控制台错误:
Failed to load resource: net::ERR_FILE_NOT_FOUND
因为传单正在尝试加载不存在的图块。 我设置了边界和 MaxBounds 以防止在地图区域外平移(以将地图保持在屏幕中央)。
var map = L.map('map', {
maxZoom: mapMaxZoom,
minZoom: mapMinZoom,
zoomControl: false,
crs: L.CRS.MySimple
}).setView([0, 0], 3);
L.tileLayer('assets/map/{z}_{x}_{y}.jpg', {
minZoom: mapMinZoom,
maxZoom: mapMaxZoom,
tileSize: 268,
noWrap: true,
reuseTiles: true,
tms: false,
bounds: mybounds,
errorTileUrl: "assets/map/404.jpg",
continuousWorld: true
}).addTo(map);
new L.Control.Zoom({position: 'topright'}).addTo(map);
var sidebar = L.control.sidebar('sidebar').addTo(map);
var mybounds = [[-8576 / 2, -8576 / 2],[8576 / 2, 8576 / 2]];
map.setMaxBounds([[-5600, -5600], [5600, 5600]]);
我做错了什么?为什么 leaflet 不断尝试加载这些图块?
我试过这样设置 MaxBounds:
map.setMaxBounds([[-8576 / 2, -8576 / 2],[8576 / 2, 8576 / 2]]);
仍然会出现这些错误。
您需要在创建 tilelayer
之前定义 mybounds
。如果您的边界恰好位于图块的边缘,您可能还需要将边界稍微拉近一点,以防止地图尝试加载相邻的图块。以下是 OSM 磁贴的示例: