Is there a way to request information through the map.on method about different veclayers? If I have two JSON veclayers, for example veclayer1 and veclayer2, could I format the information obtained from veclayer1 and another from veclayer2? Something in the way:
map.on('click', function (evt) {
var feature = map.getFeaturesAtPixel(evt.pixel,
function(feature, layer) {
return feature;
});
if (layer === veclayer1) {
...
} else if (layer === veclayer2) {
...
}
}
I tried Mike's answer (the first and the second):
var map= new ol.Map({
target: 'map',
view:view,
layers: [osm, vectorLayer, catchs],
controls: ol.control.defaults({
zoom: false,
attribution: false,
rotate: false,
}),
});
map.on('click', function (evt) {
$('#infos').show();
document.getElementById("contINFO").innerHTML = '<h3>click on layer</h3>';
/*var feature = map.getFeaturesAtPixel(evt.pixel,
function(feature, layer) {
return feature;
});*/
var layer;
var feature = map.getFeaturesAtPixel(evt.pixel,
function(feature, featureLayer) {
layer = featureLayer;
return feature;
});
if(layer === catchs){
let html = "", cod= "", art= "", date= "";
for (i=0; i<feature.length; i++){('')
if(feature[i].get('cod') != cod){
art= ""; date= "";
cod= feature[i].get('cod');
html+="<div class='txt><i class='fas fa-water'></i> " + cod + "</div>";
}
if(feature[i].get('art') != art){
date= "";
art = feature[i].get('art');
html+="<div class='txtart'><i class='fas fa-ship'></i> Art " + art + "</div>";
}
if(feature[i].get('date') != date){
date = feature[i].get('date');
html+="<div class='txtdate'><i class='far fa-calendar-alt'></i> " + date + "</div>";
}
html+="<div class='tabtxt'><div class='txtrow'><div class='txtcell'><div class='textcod'>" + feature[i].get('cod2') + "</div></div><div class='txtcell'><div class='textcod'>" + feature[i].get('kg') + " kg -</div></div><div class='txtcell'><div class='textcod'> " + feature[i].get('operation') + "</div></div></div></div>";
document.getElementById("contINFO").innerHTML = html;
}
}else if(layer === vectorLayer){
var records = document.getElementById('contINFO');
records.innerHTML = '';
var html = '';
for (i=0; i<features.length; i++){
$('#infos').show();
if(features[i].get('name') != null){
records.innerHTML += '<div id="aphia" class="aphia">' + features[i].get('name') + '</div>'
}else{
records.innerHTML += '';
}
}
}
});
But in both it only brings me back:
Click on layer
forEachFeatureAtPixel
method, notgetFeaturesAtPixel
.