지도 상자 GL : 레이어 ID 가져 오기

Question

고유 ID가있는 수십 개의 레이어가있는지도가 있습니다. 체크 박스를 사용하여 레이어를 켜고 끄기 때문에 모든 레이어 ID의 배열 하나가 필요합니다. 레이어 ID를 캡처하기 위해 모든지도 레이어를 반복하는 방법을 알아낼 수 없습니다. map.getLayer()을 사용해 보았습니다.하지만 이것은 레이어 ID가 아닌 문자열로 객체를 반환합니다. 모든 맵 레이어를 반복하고 레이어 ID 문자열을 새 배열로 푸시합니다. 어떻게해야합니까?

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

레이어를 추가 할 때 레이어 ID가 있습니다. , kielni 대답이 때문에 알 수없는 이유 편리하지

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

경우 문자열 ID의 배열을 얻을 수 매핑 개체 레이어의 배열을 얻을 수 map.getStyle().layers를 사용 : 당신은 다음 저장할 수 있습니다.

var layers = map.getStyle().layers; 

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