Mapbox GL: Ebenen-IDs abrufen

Question

Ich habe eine Karte mit ein paar Dutzend Ebenen, jede mit einer eindeutigen ID. Ich habe Kontrollkästchen, um die Ebenen ein- und auszuschalten, für die ich ein einzelnes Array aller Ebenen-IDs benötige. Ich kann nicht herausfinden, wie man alle Kartenschichten durchläuft, um die Layer-IDs zu erfassen. Ich habe versucht, map.getLayer() verwenden, aber dies gibt die Schicht als ein Objekt, nicht die Layer-ID als Zeichenfolge zurück. Ich möchte alle Kartenebenen durchlaufen und die Layer-ID-Zeichenfolgen in ein neues Array verschieben. Wie mache ich das?

mapboxgl.accessToken = "myaccesstoken"; 

var map = new mapboxgl.Map({ 
container: "map", 
style: "mapbox://styles/mymapboxstyle", 
center: [-71.0664, 42.358], 
minZoom: 14 // 
}); 

map.on("style.load", function() { 

map.addSource("contours", { 
    type: "vector", 
    url: "mapbox://mapbox.mapbox-terrain-v2" 
    }); 

map.addSource("hDistricts-2017", { 
    "type": "vector", 
    "url": "mapbox://mysource" 
    }); 

map.addLayer({ 
    "id": "contours", 
    "type": "line", 
    "source": "contours", 
    "source-layer": "contour", 
    "layout": { 
     "visibility": "none", 
     "line-join": "round", 
     "line-cap": "round" 
     }, 
    "paint": { 
     "line-color": "#877b59", 
     "line-width": 1 
     } 
    }); 

map.addLayer({ 
    "id": "Back Bay Architectural District", 
    "source": "hDistricts-2017", 
    "source-layer": "Boston_Landmarks_Commission_B-7q48wq", 
    "type": "fill", 
    "layout": { 
     "visibility": "none" 
     }, 
    "filter": ["==", "OBJECTID", 13], 
    "paint": { 
     "fill-color": "#192E39", 
     "fill-outline-color": "#000000", 
     "fill-opacity": 0.5 
     } 
    }); 

}); 

var layerIds = []; 

function getIds() { 

    //here I need to iterate through map layers to get id strings. 
    //how do I do this??? 

layerIds.push( ); //then push those ids to new array. 

console.log(layerIds); //["contours", "Back Bay Architectural District"] 

} 

Answer 1

Sie haben die Layer-IDs, wenn Sie die Ebene hinzufügen; Sie können sie dann sparen:

function addLayer(map, options, layerIds) { 
    map.addLayer(options); 
    layerIds.push(options.id); 
} 

addLayer(map, { 
    "id": "Back Bay Architectural District", 
    "source": "hDistricts-2017", 
    "source-layer": "Boston_Landmarks_Commission_B-7q48wq", 
    "type": "fill", 
    "layout": { 
     "visibility": "none" 
     }, 
    "filter": ["==", "OBJECTID", 13], 
    "paint": { 
     "fill-color": "#192E39", 
     "fill-outline-color": "#000000", 
     "fill-opacity": 0.5 
     } 
    }, 
    layerIds); 

Answer 2

Wenn kielni Antwort wegen unbekanntem Grund nicht bequem ist, verwenden Sie map.getStyle().layers ein Array von Objektschichten zu erhalten, dann wo es sich ein Array von String-IDs zu erhalten.

var layers = map.getStyle().layers; 

var layerIds = layers.map(function (layer) { 
    return layer.id; 
});