1

When I click on the map I need to create a popup and query the 3 layers (at the time I'm writing I have just 2 but they will be 3).

Here my code:

  amfeatlayer = new ol.layer.Tile({
    extent: ext,
    preload: Infinity,
    source: new ol.source.TileWMS({
      url: amfixed.wmsfeat,
      params: {
        'LAYERS': rtctwlayers,
        ...,
        format: 'image/png',
        'TILED': true
      },
      ratio: 1,
      gutter: 40,
      isBaseLayer: false,
      serverType: 'mapserver',
      crossOrigin: 'anonymous',
      projection: 'EPSG:27700',
      tileGrid: new ol.tilegrid.TileGrid({
        resolutions: resolutions,
        extent: ext,
        tileSize: [128, 128]
      })
    })
  });

  pmfeatlayer = new ol.layer.Tile({
    extent: ext,
    preload: Infinity,
    source: new ol.source.TileWMS({
      url: pmfixed.wmsfeat,
      params: {
        'LAYERS': sQLayers,
        MYORDERS: twPmSettings.defsel,
        DTO: sDTo,
        format: 'image/png'
      },
      ratio: 1,
      gutter: 40,
      serverType: 'mapserver',
      crossOrigin: 'anonymous',
      projection: 'EPSG:27700',
      tileGrid: new ol.tilegrid.TileGrid({
        resolutions: resolutions,
        extent: ext,
        tileSize: [128, 128]
      })
    })
  });

and here the code I use to get a popup:

map.on('singleclick', function(evt) {

var content = document.getElementById('popup-content');
content.innerHTML = '';
var viewResolution = map.getView().getResolution();
var coordinate = evt.coordinate;

url = pmfeatlayer.getSource().getGetFeatureInfoUrl(coordinate, 
viewResolution, projection, {
  'INFO_FORMAT': 'text/html'
});

if (url) {
  var xhttp = new XMLHttpRequest();
  xhttp.open("GET", url, true);
  xhttp.send();
  xhttp.onreadystatechange = function(aEvt) {
    if (xhttp.readyState === 4 && xhttp.status === 200) {
....

How can I query all the available layers? As you can see I have different source for every layer, I tried to combine the 2 URLs but it doesn't work properly (just to check if I can have the URL of both and then split "---" and pass each URL in the function)

URL = pmfeatlayer...
URL + "---" + amfeatlayer..

but it still printing out the first URL

1

You can only make an xhr request to one url per request. You will need to loop through all the layers and add each result to the popup (which may need to be restyled as the content grows). The order of the results may not be fixed as the server response times will vary and may not response in the same order as request were made

map.on('singleclick', function(evt) {

var content = document.getElementById('popup-content');
content.innerHTML = '';
var viewResolution = map.getView().getResolution();
var coordinate = evt.coordinate;

map.getLayers().getArray().forEach(function(layer){
 if (layer.getSource().getGetFeatureInfoUrl){
  url = layer.getSource().getGetFeatureInfoUrl(coordinate, 
  viewResolution, projection, {
    'INFO_FORMAT': 'text/html'
  });

  if (url) {
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", url, true);
    xhttp.send();
    xhttp.onreadystatechange = function(aEvt) {
      if (xhttp.readyState === 4 && xhttp.status === 200) {
          var info = xhttp.responseText;
// maybe parse the info
//        ...
          if (content.innerHTML == '') {
            content.innerHTML = info;
// initialise overlay, for example :
            overlay.setPosition(coordinate);
            map.addOverlay(overlay);

          } else {
            content.innerHTML += info;
// maybe adjust overlay style

          }

      )
    }
  }
});
  • good seems to work but how can I remove some layers from the array? I have 2 layers for the map and 1 for the overviewmap that i don't care to query. – Sebastiano Oct 30 '18 at 11:57
  • and I also have a couple of vector layers for drawing that if I try to print out the URL I have an error that can't use getGetFeatureInfoUrl() – Sebastiano Oct 30 '18 at 12:13
  • I've added an extra if statement to check that the layer supports getGetFeatureInfoUrl() – Mike Oct 30 '18 at 13:41
  • I've added extra if to query just the one I want – Sebastiano Oct 30 '18 at 14:09
  • map.getLayers().getArray().forEach(function(layer) { if (layer.getSource().getUrls) { if (layer.getSource().getUrls()[0].indexOf(fixed.wmsfeat) === 0 || layer.getSource().getUrls()[0].indexOf(pmfixed.wmsfeat) === 0 || layer.getSource().getUrls()[0].indexOf(amfixed.wmsfeat) === 0) { url = layer.getSource().getGetFeatureInfoUrl(coordinate, viewResolution, projection, { 'INFO_FORMAT': 'text/html' }); console.log(url); } } }); – Sebastiano Oct 30 '18 at 14:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.