[GIS] Displaying Feature Info for a user defined polygon

geoservergetfeatureinfoopenlayers-2wms

To retrieve feature info for a polygon selection, I have the OpenLayers code below:

        var featureTypes  = ["nig_admin1", "nig_admin2", "nig_admin3", "nig_landscan"];
        var populationCtrl = new OpenLayers.Control.GetFeature({
            protocol: OpenLayers.Protocol.WFS.fromWMSLayer(nig_landscan, {
                url: "http://localhost:8081/geoserver/wfs",
                featureType: featureTypes
            }),
            hover: false
        });

        populationCtrl.events.register("featureselected", this, function(e){
            select.addFeatures([e.feature]);
        });

I'd like to view the features retrieved in a pop up, or something similar. I've tried adding a pop up code within the featureselected event, but I can't get anything to show. Any pointers on how I can proceed will be highly appreciated.

nig_landscan in the code above refers to the corresponding WMS layer, which is a layer group in GeoServer.

My environment setup: GeoServer 2.1.3, PostGIS 1.5, OpenLayers 2.11.

Best Answer

Using WFS with filters, I was able to contruct a filter that retrieves info for the selection only. My code is as shown below:

select = new OpenLayers.Layer.Vector("Selection")
    selectCtrl = new OpenLayers.Control.SelectFeature(select, {
                clickout: false, toggle: false,
                multiple: false, hover: false,
                toggleKey: "ctrlKey", 
                multipleKey: "shiftKey", 
                box: true
            });
    map.addControl(selectCtrl);
    selectCtrl.activate();

    select.events.on({
        'beforefeatureadded': function(event) {

        },
        'featureselected': function(event) {
            var geometry900913 = event.feature.geometry;
            var geometry = geometry900913.transform(new OpenLayers.Projection("900913"), new OpenLayers.Projection("EPSG:4326"));

            var filter =  getGeometryFilter(getWkt(geometry)); 

            var wpsRequestData = getWPSRequestData(filter);
            sendWPSRequest(wpsRequestData);

            return false;
        },
        'featureunselected': function(feature) {

        }
    });

    map.addLayers([select]);
    map.addControl(new OpenLayers.Control.EditingToolbar(select));

In this, I'm using WPS chained with WFS(with filter containing info about the selected geometry). From the code above, getGeometryFilter(getWkt(geometry)) parses my geometry into WKT format, and constructs a valid filter. The filter is shown below:

function getGeometryFilter(polygon) {
    var filter =  
    '<ogc:Filter>' +
    '<ogc:Intersects>' +
        '<ogc:PropertyName>the_geom</ogc:PropertyName>' +
        '<ogc:Function name="collectGeometries">' +
         '<ogc:Function name="queryCollection">' +
            '<ogc:Literal>ws:layer_2</ogc:Literal>' +
            '<ogc:Literal>the_geom</ogc:Literal>' +
            '<ogc:Literal>INTERSECTS(the_geom,' + polygon + ')</ogc:Literal>' +
          '</ogc:Function>' +
        '</ogc:Function>' +
    '</ogc:Intersects>' +
    '</ogc:Filter>';

    return filter;
}

In my case, I was calculating population for the selected region. So, I constructed a gs:Aggregate request using the WPS request builder. I then passed the filter above to it. This is done in the getWPSRequestData(filter) method. This method is trivial if you use the WPS Request Builder.

My actual request is sent in the sendWPSRequest(wpsRequestData); function. Its details are shown below:

function sendWPSRequest(wpsRequestData) {
    var request = new OpenLayers.Request.POST({
        url: WPS_HOST,
        data: wpsRequestData,
        headers: {
            "Content-Type": "text/xml;charset=utf-8"
        },
        callback: function (response) {
            var gmlParser = new OpenLayers.Format.GML();
            var xmlSum = gmlParser.read(response.responseText);
            parsePopulation(response.responseText);
        },
        failure: function (response) {
            alert("Something went wrong in the request");
        }
    });

}

I'm sending my request via POST, and using OpenLayers.Format.GML class to deal with the GML response.

Related Question