CODEWITHSUNDEEP
openlayers-3
Alexandre Mélard
Alexandre Mélard

Reputation: 12649

vector layer loading issue in openlayers 3

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?

Upvotes: 0

Views: 1270

Answers (1)

Alexandre M&#233;lard
Alexandre M&#233;lard

Reputation: 12649

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));
        });
    }
}

Upvotes: 1

Related Questions