[GIS] WFS Layer Not displaying in Openlayers

geoserveropenlayers-2wfs

I've been pulling my hair out for a week trying to figure this problem out. perhaps you can help.

I'm trying to display a shapefile in the browser. It works great if I use WMS, but recently I've wanted to switch to WFS but have been unable to get it to work. What I get now is a map that is centered where I want it and an OSM background, but no WFS data

In geoserver, I'm pretty sure that everything is set up OK.

Here is the code I've used to request the WFS

var wfs = new OpenLayers.Layer.Vector("WFS", 
    {
        strategies: [new OpenLayers.Strategy.Fixed()],
        protocol: new OpenLayers.Protocol.WFS(
        {
            url: "http://localhost:8080/geoserver/wfs",
            featurePrefix:"Van263kTweet",
            featureType: "vantest",
            featureNS: "file:///data/2636k_shp",
            maxFeatures: 100,
            geometryName: "the_geom",
            //featurePrefix: "",
            version:"1.0.0",
            srsName: new OpenLayers.Projection("EPSG:900913"),
        }),stylemap: stylemap
    });

in the browser it generates this request:

<wfs:GetFeature xmlns:wfs="http://www.opengis.net/wfs" service="WFS" version="1.0.0"     
maxFeatures="100" 
xsi:schemaLocation="http://www.opengis.net/wfs 
http://schemas.opengis.net/wfs/1.0.0/WFS-transaction.xsd" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<wfs:Query typeName="Van263kTweet:vantest" xmlns:Van263kTweet="file:///data/2636k_shp"/>
</wfs:GetFeature>

and the response I receive is this:

<?xml version="1.0" encoding="UTF-8"?><wfs:FeatureCollection 
xmlns="http://www.opengis.net/wfs" xmlns:wfs="http://www.opengis.net/wfs" 
xmlns:gml="http://www.opengis.net/gml" xmlns:Van263kTweet="file:///data/2636k_shp" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:schemaLocation="file:///data/2636k_shp http://localhost:8080/geoserver/wfs?
service=WFS&amp;version=1.0.0&amp;request=DescribeFeatureType&amp;
typeName=Van263kTweet%3Avantest http://www.opengis.net/wfs 
http://localhost:8080/geoserver/schemas/wfs/1.0.0/WFS-basic.xsd">
<gml:boundedBy>
    <gml:null>unknown</gml:null>
</gml:boundedBy>
<gml:featureMember>
    <Van263kTweet:vantest fid="vantest.1">
        <Van263kTweet:the_geom>
            <gml:Point srsName="http://www.opengis.net/gml/srs/epsg.xml#4326">
                <gml:coordinates xmlns:gml="http://www.opengis.net/gml" 
                    decimal="." cs="," ts=" ">
                        -123.12660112,49.28351467
                </gml:coordinates>
            </gml:Point>
        </Van263kTweet:the_geom>
        <Van263kTweet:id>
            1
        </Van263kTweet:id>
    </Van263kTweet:vantest>
</gml:featureMember>
</wfs:FeatureCollection>

So as I'm generating the javascript is generating the request and the response returns GML, why isn't openlayers displaying the data? I've tried just about everything I can think of, and I'm out of ideas (changing the SRS, checking the namespace, reading geoserver log files, using different versions of WFS…).

the complete html file that the page is based on is as follows:

var map;

    // prepare to style the data
    stylemap = new OpenLayers.StyleMap({
      'strokeWidth': 11,
      'strokeColor': '#ff0000'
    });

    map = new OpenLayers.Map('map-id', {projection: "EPSG:900913"});
    osm = new OpenLayers.Layer.OSM( "Simple OSM Map");

    var wfs = new OpenLayers.Layer.Vector("WFS", 
    {
        strategies: [new OpenLayers.Strategy.Fixed()],
        protocol: new OpenLayers.Protocol.WFS(
        {
            url: "http://localhost:8080/geoserver/wfs",
            featurePrefix:"Van263kTweet",
            featureType: "vantest",
            featureNS: "file:///data/2636k_shp",
            maxFeatures: 100,
            geometryName: "the_geom",
            //featurePrefix: "",
            version:"1.0.0",
            srsName: new OpenLayers.Projection("EPSG:900913"),
        }),stylemap: stylemap
    });

    map.addLayers([osm, wfs]);     

    //set the map extent to vancouver on load
    var proj = new OpenLayers.Projection("EPSG:4326");
    var point1 = new OpenLayers.LonLat(-123.312607,49.065769);
    var point2 = new OpenLayers.LonLat(-122.424088,49.390418);
    point1.transform(proj, map.getProjectionObject());
    point2.transform(proj, map.getProjectionObject());

    //zoom/pan controls
    map.addControl(new OpenLayers.Control.PanZoomBar({
                position: new OpenLayers.Pixel(2, 15)
            }));
            map.addControl(new OpenLayers.Control.Navigation());

    //set default extent
    map.zoomToExtent([point1.lon,point1.lat,point2.lon,point2.lat]);
        //If provided as an array, the array should consist of four values 
        (left, bottom, right, top).

Best Answer

Your data is coming back as 4326 (lonlat) not 900913 so something is wrong with the request - probably as it makes no mention of a projection. Try using the string epsg:900913 instead of the projection object.

Technically you should also use version 1.1.0 for reprojection to work (but GeoServer is lenient so you'll be ok with 1.0).

Related Question