Geek Answers Handbook

Load open layers 3 jsonp vector layer using bounding box strategy?

I have a problem loading functions from a geoserver to a vector layer using OpenLayers3 and the bounding box strategy. I tried to find how I can load more than one layer using the bounding box strategy, but without success. The only example I found has one layer and uses global functions that are not applicable in my case ( http://acanimal.imtqy.com/thebookofopenlayers3/chapter03_08_loading_strategies.html ). The problem is that the function that loads the response is not defined globally - if so, I will need to create such a function for each individual layer that I want to load, right? This is an example URL for requests:

http://192.168.1.10/geoserver/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=ubutrusty:places&outputFormat=text/javascript&format_options=callback:success&srsname=EPSG:32635&bbox=161473.81383919955,4698323.564696768,234672.52335922938,4767981.6354873795,EPSG:32635

You can see that the format_options parameter is set to callback: success , and I'm sure this is a problem, but I'm afraid to set the correct callback function. My knowledge in javascript is not so good, so the question is not easy for me.

This is how I try to create a new vector layer:

var layer = {
    name: 'ubutrusty:places',
    title: '',
    source: createVectorLayer(layer),
    type: 'operational',
    visible: true,
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: '#800000',
            width: 2
        })
    })
}

This function is called for each layer that I want to add to the map - it returns an ol.source.ServerVector object:

MyApp.prototype.createVectorLayer = function(layerData){
    var vectorSource = new ol.source.ServerVector({
        format: new ol.format.GeoJSON(),
        loader: function(extent, resolution, projection) {
            extent = ol.proj.transformExtent(extent, projection.getCode(), ol.proj.get(layerData.srcEPSG).getCode());
            var url = config.proxyUrl + layerData.url + '?service=WFS&' +
                'version=1.1.0&request=GetFeature&typename=' + layerData.name + '&' + 'outputFormat=text/javascript' +
                '&format_options=callback:success&srsname=' + layerData.srcEPSG + '&bbox=' + extent.join(',') + ',' + layerData.srcEPSG;
            $.ajax({
                url: url,
                dataType: 'jsonp',
                success: function(data) {
                    this.addFeatures(this.readFeatures(data));
                },
                error: function (e) {
                    var wtf = e.status;
                }
            });
        },
        strategy: ol.loadingstrategy.bbox,
        projection: layerData.srcEPSG
    })

    return vectorSource;
}

MyApp.map.addLayer(new ol.layer.Vector(layer);

The question is, is it possible to define one function for loading functions from more than one level, and if so, how can I do this? If I do not specify a callback function, then it is used by default (for the geoserver it is parseResponse ), which is also undefined. If additional information is required, I can give additional parameters or code examples.

+4
1

URL- . success '&format_options=callback:success&srsname='. createVectorLayer , '&format_options=callback:success.' + layerData.name.replace(':', '_') + '&srsName='. success, :

window.success = {};

createVectorLayer, :

success[layerData.name.replace(':', '_')] = function(response) {
  vectorSource.addFeatures(vectorSource.readFeatures(response));
};
+1

More articles:


All Articles