Почему в листовке запрашиваются несуществующие плитки, даже если задано maxNativeZoom? - PullRequest
0 голосов
/ 26 мая 2020

У меня есть эта карта-листовка с tileLayer, где maxNativeZoom по какой-то причине не работает. Если я увеличиваю масштаб больше, чем уровень масштабирования, для которого есть плитки, а затем пытаюсь панорамировать, он запрашивает несуществующие плитки с сервера. Я вижу это в сетевой консоли.

Он не только запрашивает плитки с уровнем масштабирования 5, когда я устанавливаю maxNativeZoom: 4, он также запрашивает плитки с уровнем масштабирования 40 !! И errorTileUrl тоже не работает.

Это на уровне масштабирования 4

, а это на уровне масштабирования 5 ... 1015

Вот соответствующий код, надеюсь, один из вас заметит, что мне не хватает:

    w = 4096;
    h = 4096;
    tileDepth = 4;

    /*
    =============================================================================
    // Conversion from (x, y) raster image coordinates to equivalent of latLng
    =============================================================================
    */  

    var yx = L.latLng;
    var xy = function(x, y) {
      if (L.Util.isArray(x)) { // When doing xy([x, y]);
        return yx(x[1], x[0]);
      }
      return yx(y, x); // When doing xy(x, y);
    };

    /**
    =============================================================================
    Define basic map parameters and custom CRS by extending CRS.Simple
    =============================================================================
     */

    var minZoom = 2;
    var maxZoom = 12;
    var img = [
      w, 
      h 
    ];
    var transformationCoefficient = Math.pow(2, tileDepth);

    L.CRS.MySimple = L.extend({}, L.CRS.Simple, {
      //                      coefficients: a      b    c     d
      transformation: new L.Transformation(1/transformationCoefficient, 0, 1/transformationCoefficient, 0) // Compute a and c coefficients so that  tile 0/0/0 is from [0, 0] to [img]
    });

    var bounds = [xy(0, 0), xy(img)];

    /*
    =============================================================================
    Create the map itself
    =============================================================================
    */

    var map = L.map("map", {
      crs: L.CRS.MySimple, // http://leafletjs.com/reference-1.0.3.html#map-crs
      maxBounds: bounds, // http://leafletjs.com/reference-1.0.3.html#map-maxbounds
      minZoom: minZoom,
      maxZoom: maxZoom,
      attributionControl: false,
      zoomControl: false    //disable zoom control at standard position - we'll add a new one later
    }).setView([w/2, h/2], 0);; //this should center the map in our 1024x1024 div


    //add zoom control at new position
    L.control.zoom({
        position:'topright'
    }).addTo(map);

    /*
    =============================================================================
    Import tiles
    =============================================================================
    */


    L.tileLayer(mapPath + 'tiles/{z}/{x}/{y}.png', {
        bounds: bounds, // http://leafletjs.com/reference-1.0.3.html#gridlayer-bounds
        noWrap: true,
        minZoom: minZoom,
        maxZoom: maxZoom,
        maxNativeZoom: tileDepth,   //how deep the actual map tiles go
        errorTileUrl: imgDir + 'error_tile.png',
        attribution: mapAttribution
      }).addTo(map);
...