2
リーフレットを使用すると、ロードされたタイルの境界(NorthEast、SouthWest)を取得する方法はありますか?私はロードされている特定のタイルのマーカーのみをロードするようにサーバーに要求したいので、ユーザーが地図をパン/ドラッグしているときに、新しいエリアの新しいマーカーを簡単に見ることができます。リーフレットの読み込みタイルの境界を取得する
リーフレットを使用すると、ロードされたタイルの境界(NorthEast、SouthWest)を取得する方法はありますか?私はロードされている特定のタイルのマーカーのみをロードするようにサーバーに要求したいので、ユーザーが地図をパン/ドラッグしているときに、新しいエリアの新しいマーカーを簡単に見ることができます。リーフレットの読み込みタイルの境界を取得する
本当にやりたいことは、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);
}
});
前に、タイルがアンロードのでマーカーが削除される(つまりズームがバグやグラフィカルな不具合の原因かもしれませんのでご注意ください新しいズームレベルのマーカーがロードされます)。それに気をつけてください。