로드 된 타일의 경계 가져 오기

Question

리플렛을 사용하면로드 된 타일의 경계 (NorthEast, SouthWest)를 얻을 수있는 방법이 있습니까? 로드 된 특정 타일에 대해서만 마커를로드하도록 서버에 요청하여 사용자가 패닝/드래그 할 때 새 영역에서 새 마커를 쉽게 볼 수 있도록합니다.

Answer 1

정말하고 싶은 것은 L.GridLayer의 하위 클래스입니다. 이렇게하면로드/언로드 된 타일을 미세하게 제어 할 수 있으며 전용 L.GridLayer._tileCoordsToBounds() 메서드를 사용하는 가장 좋은 방법입니다.

L.GridLayer.MarkerLoader = L.GridLayer.extend({ 

    onAdd: function(map){ 
     // Add a LayerGroup to the map, to hold the markers 
     this._markerGroup = L.layerGroup().addTo(map); 
     L.GridLayer.prototype.onAdd.call(this, map); 

     // Create a tilekey index of markers 
     this._markerIndex = {}; 
    }, 

    onRemove: function(map){ 
     this._markergroup.removeFrom(map); 
     L.GridLayer.prototype.onRemove.call(this, map); 
    }; 

    createTile: function(coords, done) { 

     var tileBounds = this._tileCoordsToBounds(coords); 
     var tileKey = this._tileCoordsToKey(coords); 

     var url = ...; // Compute right url using tileBounds & coords.z 

     fetch(url).then(function(res){ 
      if (!key in this._markerIndex) { this._markerIndex[key] = []; } 

      // unpack marker data from result, instantiate markers 
      // Loop as appropiate 
      this._markerGroup.addLayer(marker); 
      this._markerIndex[key] = marker; 

      done(); // Signal that the tile has been loaded successfully 
     }); 
    }, 

    _removeTile: function (key) { 
     for (var i in this._markerIndex[key]) { 
      this._markerGroup.remove(this._markerIndex[key][i]); 
     } 

     L.GridLayer.prototype._removeTile.call(this, key); 
    } 
}); 

가 줌이 버그와 그래픽 결함의 원인이 될 수 있습니다주의하십시오 전에 타일 언로드 때문에 (마커가 제거되는 : 같은로드 마커의 일부 기본 처리와

,이 보일 것입니다 새로운 줌 레벨의 마커가로드 됨). 그걸 조심해.