[GIS] Openlayers4: cannot get layers from group layers

javascriptlayersopenlayers

I am having super hard times trying to figure out how to get the layers of my ol.Map object. I have two group of layers (ol.layer.Group). One is called (property 'title') "Basemaps" and contains two basemap layers (ol.layer.Base) named "OSM" and "ESRI_WorldImagery"; the other group is named "Overlays" and has only one layer inside (named "umbe points").

I'd like to be able to check if "umbe points" layer of group "Overlays" is visible with the ".getVisible()" method. However, I can only go down to each of the two group of layer level, and not to the child layers each of them contains.

I've been trying (e.g.)

1)

var group = map.getLayerGroup(); // returns a layer group containing the layers in the map (which one ???)
var layers = group.getLayers(); // returns a collection of layers that are part of this group (which one ???)
layers.item(0).get('title'); // return "Basemaps" (argh...I hoped "OSM")

2)

var group = map.getLayerGroup();
var layers = group.getLayers();
var element = layers.item(0);
var name = element.get('title');
name; // return "Basemaps" (argh...I hoped "OSM")

My code looks like this (is mostly identical to the example from ol3-layerswitcher website):

var wmsSource = new ol.source.ImageWMS({
  url: 'http://localhost/cgi-bin/mapserver/mapserv.exe?map=C:\\Umberto\\webgis\\mapserver\\umbe\\mapfile\\test5.map',
  params: {
    'LAYERS': 'points_umbe',
    'CRS': 'EPSG:32632',
    'BBOX': '465789,4999869,553468,5055262',
    'WIDTH': '800',
    'HEIGHT': '500',
    'FORMAT': 'image/png'
  },
  projection: 'EPSG:32632',
  serverType: 'mapserver',
  imageExtent: imageExtent
});

var overlays_group = new ol.layer.Group({
  title: 'Overlays',
  layers: [
    new ol.layer.Image({
      title:'umbe points',
      visible: true,
      source: wmsSource
    })
  ]
});

var basemap_group = new ol.layer.Group({
  title: 'Basemaps',
  layers: [
    new ol.layer.Tile({
      title: 'OSM',
      type: 'base',
      visible: true,
      source: new ol.source.OSM()
    }),
    new ol.layer.Tile({
       title: 'ESRI_WorldImagery',
       type: 'base',
       visible: false,
       source: new ol.source.XYZ({
       url: 'http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
       attributions: 'Tiles © Esri — Esri, DeLorme, NAVTEQ, TomTom, Intermap, iPC, USGS, FAO, NPS, NRCAN, GeoBase, Kadaster NL, Ordnance Survey, Esri Japan, METI, Esri China (Hong Kong), and the GIS User Community',
     })
   })
  ]
});

var layer_groups = [
  basemap_group,
  overlays_group
]

var map = new ol.Map({
  layers: layer_groups,
  target: 'map',
  overlays: [overlay],
  view: view
});

Best Answer

You need to go one level deeper:

var root = map.getLayerGroup(); var group1 = root.getLayers().item(0); var layer1 = group1.getLayers().item(0);

Related Question