vector layer loading issue in openlayers 3

Question

I have an issue regarding vector loading in ol3.

I am using a geoserver which doesn't handle js callback

In order to have my features loaded, I have to add them in the loader's ajax done function :

var buildLoader = function(vectorSource, $vector) {
    return function(extent, resolution, projection) {
        extent = ol.extent.applyTransform(extent, ol.proj.getTransform("EPSG:3857", "EPSG:4326"));
        var url = 'https://myurl/' + $vector.attr("url") +
            '?service=WFS' +
            '&version=' + $vector.attr("version") +
            '&request=GetFeature' +
            '&typename=' + $vector.attr("typename") +
            '&srs=' + $vector.attr("projection") +
            '&bbox=' + extent +
            '&outputFormat=json';
        $.ajax({
            url: url,
            dataType: 'json',
            xhrFields: {
              withCredentials: true
            }
        })
        .done(function(response) {
            vectorSource.addFeatures(vectorSource.readFeatures(response));
        });
    }
}

I then build an array of vectors to be added on my map.

    for (index=0; index < vectors.length; index++) {
        var $vector = $(vectors[index]);
        var vectorSource = new ol.source.ServerVector({
            format: new ol.format.GeoJSON(),
            loader: buildLoader(vectorSource, $vector),
            projection: 'EPSG:3857'
        });

        // ... //
        datas[index] = new ol.layer.Vector({
            source: vectorSource,
            visible: 'false',
            style: iconStyle
        });
    }

The problem here is that the vectorSource used by the loader is always [index - 1]

I have found an Hack, by defining the loader function after the instantiation:

        var vectorSource = new ol.source.ServerVector({
            format: new ol.format.GeoJSON(),
            projection: 'EPSG:3857'
        });
        vectorSource.loader_ = buildLoader(vectorSource, $vector);

I find this ugly enough, but there is no setLoader() available for the ServerVector type. Do you know if there is anoter solution which does not involve using another geoserver?

Alexandre Mélard Alexandre Mélard · Accepted Answer · 2015-02-02T12:10:01

I save a reference to the VectorSource object instance in the buildLoader function (instead of argument).

vectorSource = this;

Then I use that reference in the done() function:

vectorSource.addFeatures(vectorSource.readFeatures(response));

Full source:

var buildLoader = function($vector) {
    return function(extent, resolution, projection) {
        vectorSource = this;
        extent = ol.extent.applyTransform(extent, ol.proj.getTransform("EPSG:3857", "EPSG:4326"));
        var url = 'https://myurl/' + $vector.attr("url") +
            '?service=WFS' +
            '&version=' + $vector.attr("version") +
            '&request=GetFeature' +
            '&typename=' + $vector.attr("typename") +
            '&srs=' + $vector.attr("projection") +
            '&bbox=' + extent +
            '&outputFormat=json';
        $.ajax({
            url: url,
            dataType: 'json',
            xhrFields: {
              withCredentials: true
            }
        })
        .done(function(response) {
            vectorSource.addFeatures(vectorSource.readFeatures(response));
        });
    }
}

vector layer loading issue in openlayers 3

1 Answers