問題描述

我將 OpenStreetMap 與

編輯:

//加載地圖this.map_ = L.map($(selector)[0], {中央: [48.8459382,2.2863024,],最大縮放:24，縮放:20，});

我猜你用過map.options.maxZoom 設置為高數字，讓用戶縮放以查看您的室內圖像細節.

但是，OSM 磁貼在縮放級別 19 之后不可用，因此服務器返回 404 錯誤，并且您的磁貼被錯誤磁貼替換(或者如果未指定，則只是灰色磁貼).

在這種情況下，您只需在 Tile Layer 上使用這 2 個選項(一起)來告訴 Leaflet 重新使用較低縮放比例的圖塊并展開它們:

• maxNativeZoom 設置為 19.
• maxZoom 設置為您需要的任何值，并且相等到 map.options.maxZoom 如果指定.

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{maxNativeZoom: 19,//OSM 最大可用縮放為 19.maxZoom: 22//匹配地圖 maxZoom，或者不定義 map.options.maxZoom.}).addTo(地圖);

演示:http://jsfiddle.net/ve2huzxw/68/

I use OpenStreetMap with Leaflet.js.

I have a map with an indoor picture on it. The problem is when I zoom in, streets disapears. Do you know anything that can solve this plz? Tricks or tips!

EDIT:

// Load the Map
this.map_ = L.map($(selector)[0], {
    center: [
      48.8459382,
      2.2863024,
    ],

    maxZoom: 24,
    zoom: 20,
});

I guess you have used map.options.maxZoom at a high number to let the user zoom to see your indoor image details.

However, OSM tiles are not available past zoom level 19, so the server returns 404 errors and your tiles are replaced by the Error Tile (or just a grey tile if not specified).

In that case, you would simply need to use these 2 options (together) on Tile Layer to tell Leaflet to re-use tiles from a lower zoom and to expand them:

• maxNativeZoom set at 19.
• maxZoom set at whatever you need, and equal to map.options.maxZoom if specified.

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
    maxNativeZoom: 19, // OSM max available zoom is at 19.
    maxZoom: 22 // Match the map maxZoom, or leave map.options.maxZoom undefined.
}).addTo(map);

Demo: http://jsfiddle.net/ve2huzxw/68/

這篇關于全球地圖圖塊在縮放級別 19 后消失的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！