OpenLayers 4: WFS Layer not shown on the map when using ol.format.WFS

Question

I am trying to show a WFS layer using Openlayers 4. If I query the server asking for the format as json and use ol.format.GeoJSON the layer shows up correctly in the map. But querying the server with request for gml3 (and using ol.format.WFS ) does not show the layer. I checked the vectorSource and it indeed has features loaded, but they are not shown.

Anyone has any clue of what this might be? Bellow is my code and a snippet of the xml response.

loadLayer: function() {
      var wfsFormat = new ol.format.WFS();
      var self = this;
      this._vectorSource = new ol.source.Vector({
        format: wfsFormat,
        url: function(extent) {
          var url = self.serviceUrl +                  '&request=GetFeature&typeName=cite:dl_3&outputFormat=gml3&srsname=EPSG:3857' +
              '&bbox=' + extent.join(',') + ',EPSG:3857';
          return url;
      },
        strategy: ol.loadingstrategy.bbox,
        projection: 'EPSG:3857',
      });

      this.inherited(arguments);
    }

This loader is in a class called WFSLayer. Bellow is the code in the main:

var wfsLayer = WFSLayer({
            serviceUrl: wfsServiceUrl,
        });
        wfsLayer.loadLayer();

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

        var raster = new ol.layer.Tile({
            source: new ol.source.XYZ({
                attributions: 'Tiles © <a href="https://services.arcgisonline.com/ArcGIS/' +
                'rest/services/World_Topo_Map/MapServer">ArcGIS</a>',
                url: 'https://server.arcgisonline.com/ArcGIS/rest/services/' +
                'World_Topo_Map/MapServer/tile/{z}/{y}/{x}',
            }),
        });

        var map = new ol.Map({
            layers: [raster, wfsVector],
            target: document.getElementById('map'),
            view: new ol.View({
                center: [705208.0811999999, 6839435.416199997],
                zoom: 8,
                projection: 'EPSG:3857',
            }),
        });

And here is a snippet of the xml response:

<wfs:FeatureCollection xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:wfs="http://www.opengis.net/wfs" xmlns:gml="http://www.opengis.net/gml" xmlns:cite="http://www.opengeospatial.net/cite" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" numberOfFeatures="10070" timeStamp="2017-06-15T15:06:48Z" xsi:schemaLocation="http://www.opengeospatial.net/cite http://geoserver:8080/geoserver/wfs?service=WFS&version=1.1.0&request=DescribeFeatureType&typeName=cite%3Adl_3 http://www.opengis.net/wfs http://geoserver:8080/geoserver/schemas/wfs/1.1.0/wfs.xsd">
<gml:featureMembers>
<cite:dl_3 gml:id="dl_3.1">
<cite:the_geom>
<gml:MultiLineString srsName="http://www.opengis.net/gml/srs/epsg.xml#3857" srsDimension="3">
<gml:lineStringMember>
<gml:LineString>
<gml:posList>
498498.93497989 6786346.91870299 43.80370511 498497.04800763 6786352.73097019 43.68967084 498495.16103228 6786358.54324726 43.83243658 498498.89640871 6786359.76200893 43.70402609 498499.33127574 6786359.90391212 43.65502487 498501.21824812 6786354.09163816 43.72265914 498503.10521781 6786348.27936783 43.7882934 498502.63037784 6786348.12447027 43.82089473 498498.93497989 6786346.91870299 43.80370511
</gml:posList>
</gml:LineString>
</gml:lineStringMember>
</gml:MultiLineString>
</cite:the_geom>
</cite:dl_3>
<cite:dl_3 gml:id="dl_3.2">
<cite:the_geom>
<gml:MultiLineString srsName="http://www.opengis.net/gml/srs/epsg.xml#3857" srsDimension="3">
<gml:lineStringMember>
<gml:LineString>
<gml:posList>
498509.86707833 6786343.314062 43.70141855 498508.02631507 6786349.10070888 43.75378441 498506.18554938 6786354.88735662 43.69115027 498509.61544357 6786355.98400546 43.67794078 498510.10837676 6786356.14156283 43.62683941 498511.94913995 6786350.35491354 43.70037356 498513.78990048 6786344.56826831 43.7912077 498513.44929737 6786344.45934742 43.78340864 498509.86707833 6786343.314062 43.70141855
</gml:posList>
</gml:LineString>
</gml:lineStringMember>
</gml:MultiLineString>
</cite:the_geom>
</cite:dl_3>
<cite:dl_3 gml:id="dl_3.3">
<cite:the_geom>
<gml:MultiLineString srsName="http://www.opengis.net/gml/srs/epsg.xml#3857" srsDimension="3">
<gml:lineStringMember>
<gml:LineString>
<gml:posList>
498513.37376869 6786275.58223307 43.95293282 498510.96125125 6786281.14230307 43.92010051 498508.54873049 6786286.70237625 43.89516819 498511.70049349 6786288.07686893 43.8335572 498514.11293161 6786282.51679254 43.84838951 498516.5253664 6786276.95671993 43.89402182 498513.70936863 6786275.72873202 43.95213165 498513.37376869 6786275.58223307 43.95293282
</gml:posList>
</gml:LineString>
</gml:lineStringMember>
</gml:MultiLineString>
</cite:the_geom>
</cite:dl_3>
<cite:dl_3 gml:id="dl_3.4">
<cite:the_geom>
<gml:MultiLineString srsName="http://www.opengis.net/gml/srs/epsg.xml#3857" srsDimension="3">
<gml:lineStringMember>
<gml:LineString>
<gml:posList>
498547.56469744 6786240.41906434 43.91062195 498546.95224789 6786240.21669251 43.91602369 498547.4916903 6786238.48738942 43.91663392 498548.12052306 6786238.67374152 43.91073226 498547.56469744 6786240.41906434 43.91062195
</gml:posList>
</gml:LineString>
</gml:lineStringMember>
</gml:MultiLineString>
</cite:the_geom>
</cite:dl_3>
<cite:dl_3 gml:id="dl_3.20">
<cite:the_geom>
<gml:MultiLineString srsName="http://www.opengis.net/gml/srs/epsg.xml#3857" srsDimension="3">
<gml:lineStringMember>
<gml:LineString>
<gml:posList>
498835.21795003 6785163.91809574 46.00415766 498829.6138097 6785161.26036719 46.02577907
</gml:posList>
</gml:LineString>
</gml:lineStringMember>
</gml:MultiLineString>
</cite:the_geom>
</cite:dl_3>

Answer 1

I figured it out. In case someone out there has the same problem. The problem is I was using GML3 with a 3D layer. Openlayers does not correctly take the srsDimension attribute from the XML so the coordinates will be incorrect. As of now you can use GML2 for this (or process the XML before). I have added it as an issue to git.