Search code examples
javascriptopenlayers

OpenLayers 4 - LayerFilter on forEachFeatureAtPixel


I have 2 vector layers of which I want only 1 to be selectable for a WFS get feature info layer. OL4 docs tell me there is an opt_layerfilter for the forEachFeatuerAtPixel function.

I’m in a similar situation like this: OpenLayers 3 hasFeatureAtPixel filter for layer. Due to my lack of JavaScript knowledge I can’t seem to make it work with the following code in OpenLayers 4:

var displayFeatureInfo = function (pixel) {

    var features = [];
    map.forEachFeatureAtPixel(pixel, {
        layerFilter: function (layer) {
            return layer.get('name') === 'isochrones';
        }
    }, function (feature) {
        features.push(feature);
    });

    if (features.length > 0) {
        var info = [];
        var i, ii;
        for (i = 0, ii = features.length; i < ii; ++i) {
            info.push('<div id="infobox">' + '<p2>' + 'Isochroon ' + features[i].get('name') + ', locatie ' + features[i].get('facilityid') + '</p2>' + '<p>' + 'aantal lopend: ' + features[i].get('n_pedestrians') + ', fiets: ' + features[i].get('n_bike') + ', ebike: ' + features[i].get('n_ebike') + '<br>' + 'speedpedelec: ' + features[i].get('n_speedpedelec') + ', auto: ' + features[i].get('n_car') + '</p>' + '</div>');
        }
        document.getElementById('info').innerHTML = info.join(', ') || '&nbsp';
    } else {
        document.getElementById('info').innerHTML = '&nbsp;';
    }
};

map.on('click', function (evt) {
    displayFeatureInfo(evt.pixel);
});

The layer I want to be selectable is named ‘isochrones’. It throws me an error “d.call is not a function” when I try to click any vector layer in the map.

Could anyone point me in the right direction?


Solution

  • Looks like you have your args swapped.

    The params for forEachFeatureAtPixel are (pixel, callback, options)

    You have (pixel, options, callback)