I am trying to develop a web mapping application. I have more than two WMS layers and trying to GetFeatureInfo onclick the layer. I tried the answer posted on this link. But whenever I click on one layer three popups are displayed in spite of clicking only on one layer. I am stuck on how to resolve the issue.
Below is the code am working on:
map.on('singleclick', function (evt1) {
var coordinate = evt1.coordinate;
content.innerHTML = '';
var viewResolution =(view.getResolution());
var url = '';
content.innerHTML = '';
layers.forEach(function (layer, i, layers) {
if (layer.getVisible() && layer.get('name')!='Basemap') {
url = layer.getSource().getGetFeatureInfoUrl(evt1.coordinate, viewResolution, 'EPSG:3857', {
'INFO_FORMAT': 'text/html','FEATURE_COUNT': '300', 'WIDTH':500, 'HEIGHT':500,
});
if (url) {
var left_f = "left_frame";
content.innerHTML += '<p><b>You clicked here:</b></p><iframe class="'+left_f+'" seamless src="' + url +
'"></iframe>';
overlay.setPosition(coordinate);
}else{
content.innerHTML = '';
}
}
});
});
Query:
GetFeatureInfo with a popup on click single layer or multiple layers. Is there any other way to solve this query?
I am new with OpenLayers and have basics of JavaScript. Below screenshots of output are attached.