Angular5 Openlayers4
Я пытаюсь создать карту с несколькими слоями, для которых я могу установить значение false или true. Это мой код для настройки карты:
this.map = new OlMap({
target: 'map',
layers: [
new OlTileLayer({
source: new OSM()
}), new Group({
layers: [
new OlTileLayer({
source: new TileJSON({
url: 'https://api.tiles.mapbox.com/v3/mapbox.20110804-hoa-foodinsecurity-3month.json?secure',
crossOrigin: 'anonymous'
})
}),
new OlTileLayer({
source: new TileJSON({
url: 'https://api.tiles.mapbox.com/v3/mapbox.world-borders-light.json?secure',
crossOrigin: 'anonymous'
})
})
]
})
],
view: this.view
});
Он работает нормально, я вижу карту и все слои. С помощью флажка я хочу установить для определенного слоя значение false или true.
Как я могу получить идентификатор каждого добавленного мной слоя и как установить для видимости значение false. Я использую openlayers4 с Angular5
Большое спасибо!
Ответы 2
Сначала я бы определил свои слои вне элементов управления картой как переменную, потому что тогда их можно было бы легко отключить или отключить с помощью прослушивателя событий на вашем флажке. Синтаксис здесь будет немного другим, потому что я не использую Angular, но функциональность такая же.
var floodZones=new ol.layer.Tile({
source: new ol.source.TileWMS({
extent: [-8459941, 4191197.5, -8400060, 4333020.5],
url:'/geoserver/Property_Map/wms',
params: {'Layers':'Property_Map:flood_3857', 'TILED':true},
transition:0,
serverType:'geoserver',
version: '1.1.0'
})
});
document.getElementById("flood").addEventListener("click", function(){
if (!toggleFlood){
map.removeLayer(floodZones)
} else {
map.addLayer(floodZones)
}
toggleFlood=!toggleFlood
});
window.toggleFlood=true;
Да, у меня их 12, скопируйте и вставьте, а затем измените имена и параметры, если ваш друг. Если они не названы, то как ваш чек-бокс узнает, какой из них включить / выключить?
в то время как у них есть фиксированное число, можно создать такое количество переменных, если вы предпочитаете, вы можете добавить их в массив
Если у вас есть идентификатор или какое-либо другое свойство, определенное для ваших слоев, вы можете получить их с помощью map.getLayers() и использовать foreach, чтобы найти слой с этим свойством с помощью layer.get().
Пример:
new OlTileLayer({
id: 'osm',
source: new OSM()
})
Вы можете получить этот слой и сделать его видимым с помощью этого
map.getLayers().forEach(function(layer) {
if (layer.get('id') == 'osm') {
layer.setVisible(false);
}
});
Чтобы реализовать это с помощью флажка, вам, вероятно, придется назначить это свойство слоя как значение флажка и сравнить с layer.get('id').
Обратите внимание, что это не обязательно должен быть id, вы можете использовать любое имя, какое захотите. И похоже, что вы используете группы слоев, и если вы хотите получить слой группы, вам нужно получить слои из группы вместо карты, такой как layergroup.getLayers().
проблема в том, что когда у меня 10 слоев, мне нужно определить 10 переменных