传单 - 瓷砖加载事件

Question

我目前正在开发一个基于地图的应用程序，并且需要一种方法来在 Leaflet 从 TileProvider（在我的例子中是 MapBox 中提取图块时得到通知).我看了Leaflet documentation, especially the part with the TileLayer。目前，我正在使用以下代码附加一个 tileload 处理程序：

map.eachLayer(function (layer) {
    layer.on('tileload', function(e) {
        console.log(e);
    });
});

有没有更好的方法获取当前地图的TileLayer？这种方法的一个问题是我将处理程序挂接到所有层（尽管只有 TileLayers 会引发事件，但挂钩所有层也是不干净的）。或者我能以某种方式将处理程序直接附加到地图实例吗？

更新

我使用以下 MapBox 代码片段初始化地图：

map = L.mapbox.map( element, '...', mapOptions );

这会自动创建一个 TileLayer（和其他几个层），将它们附加到 map 对象和 returns 这个对象供以后使用。

Answer 1

为什么不直接在tile图层上使用tileload事件，像这样：

//create a variable to store the tilelayer
var osm = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);

//add the tileload event directly to that variable
osm.on('tileload', function (e) {
    console.log(e);
});

Answer 2

如果您有很多 L.mapbox.TileLayer 个实例并且您不想像 Alexandru Pufan 在他的回答中建议的那样手动将事件处理程序添加到每个实例，您仍然可以使用循环和 Object的instanceof方法：

map.eachLayer(function (layer) {
    if (layer instanceof L.mapbox.TileLayer) {
        layer.on('tileload', function(e) {
            console.log(e);
        });
    }
});

阅读您对 Alexandru 的回答的评论后，我猜您只有一层，那么最好将其手动添加到实例中，这可以通过 L.mapbox.TileLayer 实现，如下所示：

var layer = L.mapbox.tileLayer(YOUR MAP ID);
layer.on('tileload', function(e) {
    console.log(e);
});

var map = L.mapbox.map('mapbox', null, {
    'center': [0, 0],
    'zoom': 0,
    'layers': [layer]
});

传单 - 瓷砖加载事件

Leaflet - Event on tiles loading

javascript

leaflet

mapbox

更新