简体   繁体   中英

Failing to load another WFS using the WFS example from the site of OpenLayers 3 as base

I'm starter with OpenLayers3 and I am new on this site so this is my first question and hope I drop it correctly here. What does not work for me is to open a (not tiled?) WFS layer in OpenLayers3. I use as a base a WFS example of the site of open layers (also because it seems to be a relatively simple code). I tried to find a solution in my textbooks OpenLayers3, on the site of open layers, with Google and on this site but without success. Below the code I made with the example of OpenLayers and again but now for another WFS as I think it should be to open this WFS. What am I doing wrong?

 // working example from: http://openlayers.org/en/v3.13.1/examples/vector-wfs.html

  var vectorSource = new ol.source.Vector({
    format: new ol.format.GeoJSON(),
    url: function(extent) {
      return 'http://demo.boundlessgeo.com/geoserver/wfs?service=WFS&' +
          'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
          'outputFormat=application/json&srsname=EPSG:3857&' +
          'bbox=' + extent.join(',') + ',EPSG:3857'; 
        },
    strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
      maxZoom: 19
    }))
  });  


  var vector1 = new ol.layer.Vector({
    source: vectorSource,
    style: new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: 'rgba(0, 255, 255, 1.0)',
        width: 2
      })
    })
  });  

// The not working code based on the example code above

var vectorSource = new ol.source.Vector({
    format: new ol.format.GeoJSON(),
    url: function(extent) {
      return 'https://geodata.nationaalgeoregister.nl/bestuurlijkegrenzen/wfs?service=WFS&' +
          'version=1.1.0&request=GetFeature&typename=bestuurlijkegrenzen:gemeenten&' +
          'outputFormat=application/json&srsname=EPSG:28992&' +
          'bbox=' + extent.join(',') + ',EPSG:28992'; 

             },
    strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
      maxZoom: 19
    }))
  });


  var vector = new ol.layer.Vector({
    source: vectorSource,
    style: new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: 'rgba(0, 255, 255, 1.0)',
        width: 2
      })
    })
  });

Unless you provide your full code I can only make some guesses. Your two layers have different projections. I guess you use epsg:3857 for your view projection and so using coordinates from this extent will return 0 features. A first thing to try is to request your layer from geoserver using the projection of your view.

var vectorSource = new ol.source.Vector({
    format: new ol.format.GeoJSON(),
    url: function(extent) {
      return 'https://geodata.nationaalgeoregister.nl/bestuurlijkegrenzen/wfs?service=WFS&' +
          'version=1.1.0&request=GetFeature&typename=bestuurlijkegrenzen:gemeenten&' +
          'outputFormat=application/json&srsname=EPSG:3857&' +
          'bbox=' + extent.join(',') + ',EPSG:3857'; 

             },
    strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
      maxZoom: 19
    }))
  });

This will force geoserver to do the reprojection on the server side. I would suggest to first try the above so make sure this is your case. Then you have to deside whether you want to do the rerpojection on client or on the server side.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM