Umgang mit Popups in Broschüren mit überlappenden Funktionen?

Ich bin neu in Leaflet sowie Javascript.

Derzeit versuche ich, einen räumlichen Index der Bibliotheksbestände für alte topografische Karten zu erstellen, auf die Benutzer online zugreifen und diese herunterladen können. Die Quelle der Funktionen ist eine GeoJSON-Datei.

Beispielkarte

Das Problem ist, dass die Schulbibliothek im Laufe der Jahre mehrere Typen derselben Karte hat, aber wenn ich auf eine Karte klicke, wird nur ein Popup angezeigt. Ich möchte die Option, mehrere Karten zu durchlaufen, bin mir aber nicht sicher, wie ich das Problem angehen soll.

Gibt es im lokalen Jargon einen speziellen Begriff für das Durchlaufen überlappender Polygone oder gibt es einen stärkeren Ansatz für dieses Problem?

Eine Option wäre die Verwendung eines Faltblattpunkts in poly (leaflet.pip), der über Mapbox verfügbar ist: https://www.mapbox.com/mapbox.js/example/v1.0.0/point-in-polygon/ Oder als Broschüren-Plugin: https://github.com/mapbox/leaflet-pip

Die Geige hier: http://jsfiddle.net/TnX96/136/ zeigt genau, wie das funktionieren würde. Oder sehen Sie den Code unten ....

HTML muss die PIP-Bibliothek enthalten:

<script src='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-pip/v0.0.2/leaflet-pip.js'></script>

Javascript:

var map = new L.Map('map', {center: new L.LatLng(51, -100), zoom: 4});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var ggl = new L.Google();
var ggl2 = new L.Google('TERRAIN');
map.addLayer(osm);
map.addControl(new L.Control.Layers( {'Street Maps':osm, 'Satellite':ggl, 'Terrain':ggl2}, {}));

function handleClick(e) {
    var html = '';
        var match = leafletPip.pointInLayer(
            // the clicked point
            e.latlng,
            // this layer
            streets,
            // whether to stop at first match
            false);
        if (match.length) {
            for (var i = 0; i < match.length; i++) { 
                html += "<br>"+"_____"+
                        "<br><b>" + match[i].feature.properties.title + ", " + match[i].feature.properties.subtitle + ":</b>" + 
                        "<br>Scale: " + match[i].feature.properties.Scale + 
                        "<br>Year Published: " + match[i].feature.properties.year + 
                        "<br><br><b>URL for map:</b> <a>" + match[i].feature.properties.location2 + "</a>"+
                        "<br><b>URL for cropped, georeferenced map:</b> <a>"+ match[i].feature.properties.location1 + "</a>"+
                        "<br><b>URL for KML:</b> <a>" + match[i].feature.properties.location3 +"</a>"

            }
        }
    if (html) {
        map.openPopup(html, e.latlng);
    }
}

var streets = new L.geoJson(histMap)
    .on('click', handleClick)
    .addTo(map);