2

I cannot load features to vector layer even though I can see the array with my 60 features in console. The GeoJSON is in EPSG: 4326. I do not need to reproject it. Any idea what is wrong?

var osmmap = new ol.layer.Tile({
    source: new ol.source.OSM()
});

// placeholder due to weird GeoServer
// without the function it raises an error
function getJson(data) {

};


var vectorSource = new ol.source.Vector({});


var vectorLayer = new ol.layer.Vector({
    source: vectorSource,
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: '#00c10e',
            width: 2
        })
    })
});

var view = new ol.View({
    center: ol.proj.fromLonLat([17, 48.97]),
    zoom: 9.5
});

var map = new ol.Map({
    layers: [osmmap, vectorLayer],
    target: 'map',
    view: view
});


$.ajax({
    jsonpCallback: 'getJson',
    dataType: 'jsonp',
    url: 'http://localhost:8080/geoserver/d2/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=d2:d2&outputFormat=text/javascript&format_options=callback:getJson',
    success: function(data) {
        var format = new ol.format.GeoJSON();
        var features = format.readFeatures(data, {
            featureProjection: "EPSG:4326"
        });
        vectorSource.addFeatures(features);
        console.log(features);
    }
})

Here is response (GeoJSON) from the WFS request (I copy/pasted only 1 feature):

getJson(
{
    "type": "FeatureCollection",
    "totalFeatures": 60,
    "features": [{
        "type": "Feature",
        "id": "d2.52",
        "geometry": {
            "type": "MultiLineString",
            "coordinates": [
                [
                    [16.71586821, 48.96378821],
                    [16.7148566, 48.9646265],
                    [16.7119988, 48.9668265],
                    [16.7100807, 48.9682972],
                    [16.7080679, 48.9697612],
                    [16.7055068, 48.9717537],
                    [16.7036873, 48.9732986],
                    [16.7018392, 48.9750305],
                    [16.7003699, 48.9765134],
                    [16.6994527, 48.9774725],
                    [16.69904326, 48.97792493]
                ]
            ]
        },
        "geometry_name": "geom",
        "properties": {
            "usek": 50,
            "stav_1": 120,
            "stav_2": 81,
            "stav_3": 81,
            "stav_4": 23,
            "stav_5": 120,
            "stav_6": 110,
            "stav_7": 120,
            "stav_8": 71,
            "stav_9": 9,
            "stav_10": 94,
            "stav_11": 134,
            "stav_12": 118,
            "stav_13": 87,
            "stav_14": 96,
            "stav_15": 30,
            "stav_16": 4,
            "stav_17": 83,
            "stav_18": 46,
            "stav_19": 127,
            "stav_20": 17,
            "stav_21": 25,
            "stav_22": 51,
            "stav_23": 16,
            "stav_24": 79,
            "stav_25": 22,
            "stav_26": 13,
            "stav_27": 16,
            "stav_28": 103,
            "stav_29": 78,
            "stav_30": 74,
            "stav_31": 127,
            "stav_32": 130,
            "stav_33": 47,
            "stav_34": 81,
            "stav_35": 76,
            "stav_36": 57,
            "stav_37": 119,
            "stav_38": 43,
            "stav_39": 7,
            "stav_40": 15,
            "stav_41": 1,
            "stav_42": 112,
            "stav_43": 123,
            "stav_44": 131,
            "stav_45": 82,
            "stav_46": 29,
            "stav_47": 44,
            "stav_48": 77,
            "stav_49": 19,
            "stav_50": 27,
            "stav_51": 102,
            "stav_52": 119,
            "stav_53": 76,
            "stav_54": 59,
            "stav_55": 39,
            "stav_56": 11,
            "stav_57": 66,
            "stav_58": 64,
            "stav_59": 38,
            "stav_60": 66,
            "stav_61": 48,
            "stav_62": 102,
            "stav_63": 7,
            "stav_64": 96,
            "stav_65": 18,
            "stav_66": 120,
            "stav_67": 87,
            "stav_68": 60,
            "stav_69": 62,
            "stav_70": 56,
            "stav_71": 27,
            "stav_72": 61,
            "stav_73": 25,
            "stav_74": 21,
            "stav_75": 126,
            "stav_76": 18,
            "stav_77": 9,
            "stav_78": 133,
            "stav_79": 70,
            "stav_80": 61,
            "stav_81": 99,
            "stav_82": 87,
            "stav_83": 28,
            "stav_84": 112,
            "stav_85": 81,
            "stav_86": 42,
            "stav_87": 118,
            "stav_88": 73,
            "stav_89": 34,
            "stav_90": 26,
            "stav_91": 79,
            "stav_92": 52,
            "stav_93": 38,
            "stav_94": 52,
            "stav_95": 48,
            "stav_96": 74,
            "stav_97": 111,
            "stav_98": 21,
            "stav_99": 50,
            "stav_100": 93,
            "stav_101": 18,
            "stav_102": 105,
            "stav_103": 121,
            "stav_104": 103,
            "stav_105": 68,
            "stav_106": 25,
            "stav_107": 89,
            "stav_108": 130,
            "stav_109": 2,
            "stav_110": 46,
            "stav_111": 111,
            "stav_112": 117,
            "stav_113": 74,
            "stav_114": 107,
            "stav_115": 8,
            "stav_116": 9,
            "stav_117": 133,
            "stav_118": 26,
            "stav_119": 6,
            "stav_120": 46,
            "stav_121": 26,
            "stav_122": 74,
            "stav_123": 75,
            "stav_124": 55,
            "stav_125": 66,
            "stav_126": 32,
            "stav_127": 12,
            "stav_128": 7,
            "stav_129": 18,
            "stav_130": 9,
            "stav_131": 43,
            "stav_132": 100,
            "stav_133": 2,
            "stav_134": 13,
            "stav_135": 22,
            "stav_136": 74,
            "stav_137": 131,
            "stav_138": 85,
            "stav_139": 60,
            "stav_140": 92,
            "stav_141": 132,
            "stav_142": 58,
            "stav_143": 68,
            "stav_144": 85,
            "stav_145": 46,
            "stav_146": 105,
            "stav_147": 2,
            "stav_148": 98,
            "stav_149": 72,
            "stav_150": 37,
            "stav_151": 99,
            "stav_152": 36,
            "stav_153": 131,
            "stav_154": 8,
            "stav_155": 34,
            "stav_156": 95,
            "stav_157": 62,
            "stav_158": 19,
            "stav_159": 108,
            "stav_160": 119,
            "stav_161": 72,
            "stav_162": 92,
            "stav_163": 81,
            "stav_164": 59,
            "stav_165": 121,
            "stav_166": 46,
            "stav_167": 73,
            "stav_168": 99,
            "stav_169": 121,
            "stav_170": 17,
            "stav_171": 62,
            "stav_172": 26,
            "stav_173": 59,
            "stav_174": 130,
            "stav_175": 105,
            "stav_176": 57,
            "stav_177": 81,
            "stav_178": 30,
            "stav_179": 22,
            "stav_180": 31,
            "stav_181": 131,
            "stav_182": 26,
            "stav_183": 78,
            "stav_184": 112,
            "stav_185": 30,
            "stav_186": 49,
            "stav_187": 78,
            "stav_188": 2,
            "stav_189": 60,
            "stav_190": 14,
            "stav_191": 8,
            "stav_192": 122,
            "stav_193": 53,
            "stav_194": 38,
            "stav_195": 53,
            "stav_196": 109,
            "stav_197": 10,
            "stav_198": 109,
            "stav_199": 59,
            "stav_200": 92,
            "stav_201": 28,
            "stav_202": 18,
            "stav_203": 82,
            "stav_204": 32,
            "stav_205": 18,
            "stav_206": 38,
            "stav_207": 28,
            "stav_208": 36,
            "stav_209": 21,
            "stav_210": 70,
            "stav_211": 17,
            "stav_212": 91,
            "stav_213": 27,
            "stav_214": 79,
            "stav_215": 110,
            "stav_216": 115,
            "stav_217": 109,
            "stav_218": 106,
            "stav_219": 113,
            "stav_220": 37,
            "stav_221": 130,
            "stav_222": 6,
            "stav_223": 6,
            "stav_224": 66,
            "stav_225": 62,
            "stav_226": 31,
            "stav_227": 82,
            "stav_228": 116,
            "stav_229": 102,
            "stav_230": 5,
            "stav_231": 4,
            "stav_232": 95,
            "stav_233": 46,
            "stav_234": 47,
            "stav_235": 59,
            "stav_236": 130,
            "stav_237": 99,
            "stav_238": 75,
            "stav_239": 37,
            "stav_240": 31,
            "stav_241": 67,
            "stav_242": 99,
            "stav_243": 91,
            "stav_244": 21,
            "stav_245": 21,
            "stav_246": 9,
            "stav_247": 65,
            "stav_248": 10,
            "stav_249": 69,
            "stav_250": 14,
            "stav_251": 14,
            "stav_252": 102,
            "stav_253": 80,
            "stav_254": 10,
            "stav_255": 132,
            "stav_256": 21,
            "stav_257": 118,
            "stav_258": 47,
            "stav_259": 101,
            "stav_260": 3,
            "stav_261": 125,
            "stav_262": 131,
            "stav_263": 62,
            "stav_264": 5,
            "stav_265": 70,
            "stav_266": 92,
            "stav_267": 123,
            "stav_268": 132,
            "stav_269": 16,
            "stav_270": 98,
            "stav_271": 95,
            "stav_272": 53,
            "stav_273": 12,
            "stav_274": 129,
            "stav_275": 29,
            "stav_276": 33,
            "stav_277": 5,
            "stav_278": 79,
            "stav_279": 101,
            "stav_280": 6,
            "stav_281": 103,
            "stav_282": 101,
            "stav_283": 80,
            "stav_284": 46,
            "stav_285": 81,
            "stav_286": 28,
            "stav_287": 20,
            "stav_288": 117
        }
    }]
}
)
  • 1
    Can you give more details, what projection is your vector layer in, is the projection set, does it need to be re-projected. – Mapperz Sep 20 '16 at 20:57
  • Updated (if I understand what you mean correctly) – Jihlavanka Sep 21 '16 at 8:06
  • 1
    It may also be helpful to include an example or two of the JSON features. – Evil Genius Sep 21 '16 at 10:56
  • 1
    Try this jsfiddle.net/1sjk0mhy. Its taken from here: openlayers.org/en/v3.6.0/examples/vector-wfs.html just changed tileLayer. Let us know if it worked. – vayacondios2015 Sep 21 '16 at 16:14
  • 1
    Where is this data anyway, is it from Czech Republic? I assume that from center. But its strange how geojson validator draw geojson data in USA. Maybe I am doing something wrong. – vayacondios2015 Sep 21 '16 at 16:20
1

I solved it by adding 2 same layers so when the 1st one is reloading features from GeoServer the 2nd one is still present in the map and after that I reload features for the 2nd layer too so the user always sees a layer. Here is how I load the data for the vector source.

var vectorSource = new ol.source.Vector({
        loader: function(extent, resolution, projection) {
            $.ajax({
                jsonpCallback: 'getJson',
                dataType: 'jsonp',
                url: 'http://localhost:8080/geoserver/d2/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=d2:d2&outputFormat=text/javascript&format_options=callback:getJson',
                success: function(data) {
                    var format = new ol.format.GeoJSON();
                    var features = format.readFeatures(data, {
                        featureProjection: projection
                    });
                    vectorSource.addFeatures(features);

                }
            })
        },
        strategy: ol.loadingstrategy.all
    });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.