Question

我目前正在开发基于地图的应用程序，并且需要一种方法来在Leaflet从TileProvider（在我的情况下为MapBox）中提取切片时收到通知。我读了Leaflet documentation，特别是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对象并返回此对象以供日后使用。

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]
});

宣传单 - 瓷砖装载事件

更新

2 个答案: