Leaflet js map初始化和回调功能

Question

假设我正在使用传单js加载地图。可能是由于互联网连接速度慢，可能需要很长时间才能加载。所以我想在加载地图时显示忙图标，并在地图加载完成时隐藏忙图标。

这里有一个示例代码

var map = L.map('map').setView([37.8, -96], 4);

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6IjZjNmRjNzk3ZmE2MTcwOTEwMGY0MzU3YjUzOWFmNWZhIn0.Y8bhBaUMqFiPrDRW9hieoQ', {
    maxZoom: 18,
    attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
        '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
        'Imagery © <a href="http://mapbox.com">Mapbox</a>',
    id: 'mapbox.light'
}).addTo(map);

告诉我怎么能附上一个回调通知我在客户端完成地图加载和渲染。是否有地图加载完成的回调功能？

我搜索谷歌，并知道有缩放回调。这里有一个示例代码

map.on("zoomstart", function (e) { console.log("ZOOMSTART", e); });
map.on("zoomend", function (e) { console.log("ZOOMEND", e); });

Answer 1

这个名为Leaflet.loading的插件会在加载地图图块时显示一个idicator。

如果您想构建自己的版本，可以使用该代码或查看源代码。