[GIS] Selection in WMS layer using OpenLayers

geoserveropenlayers-2vectorwms

I added 4 WMS layers (three polygons and one have point geometry) from GeoServer on my webpage

My requirement is:

  1. I have to select a single polygon of one wms layer using a mouse click. After the selection, the polygon color should be changed. If you select another polygon, the previous selected polygon color is to be changed to original color.

  2. If I select a polygon of one wms layer, I want to get the NAME of the selected polygon as an alert.

    layer = new OpenLayers.Layer.WMS(

    "Layer", "http://********:8080/geoserver/POC/wms",

            {
            LAYERS: 'POC:CIRCLE_VIEW',
            STYLES: '', 
            wrapDateLine: true, 
            format: format,
            transparent:true

        },
        {
           singleTile: true, 
           ratio: 1, 
           isBaseLayer: false,
           yx : {'EPSG:42106' : false}

        }

    );

`

I added four layers in this way..

var infoControls = {
         click: new OpenLayers.Control.WMSGetFeatureInfo({
             url: 'http://********:8080/geoserver/POC/wms', 
             title: 'Details',
             layers: [layer,layer2,layer3,layer4],
             queryVisible: true
         }),
         hover: new OpenLayers.Control.WMSGetFeatureInfo({
        url: 'http://********:8080/geoserver/POC/wms',
             title: 'Details',
           layers: [layer,layer2,layer3,layer4],
             hover: true,
             queryVisible: true
         })
     };
    for (var i in infoControls) 
    {
        
        infoControls[i].events.register("getfeatureinfo", this, showInfo);
        map.addControl(infoControls[i]); 
    }
        infoControls.click.activate();
function showInfo(evt) {
            if (evt.features && evt.features.length) {
                
                 highlightLayer.destroyFeatures();
                 highlightLayer.addFeatures(evt.features);
                 highlightLayer.redraw();
            } else {
                highlightLayer.destroyFeatures();
                 highlightLayer.addFeatures(evt.features);
                 highlightLayer.redraw();
                document.getElementById('responseText').innerHTML = evt.text;
            }
        }

In this I am showing attribute data of selected polygon.

Best Answer

The WMS specification does not provide a function to select features and/or colorize them by selection. It only provides pretty dumb map images. With GetFeatureInfo you only can query what is under a specific coordinate / pixel, to get the attributes of the feature which was used to render the map image.

For a select features function you also have to use a WFS Service in the background additionaly to the WMS which is used to render a nice looking map.

You are right, it is possible to hack around with Styled Layer Descriptors and GetFeatureInfo Requests to emulate a Feature Highlight only with WMS. Actually I don't know what are the disadvantages of this hack, if there are any, but what I can say is, that the WMS protocol was not intended to perform this (mind that every selection triggers a new rendering of the map image on the server). Selecting and Querying of vector data is the main reason for the WFS specification. Check out this stable example on the OpenLayers page http://openlayers.org/dev/examples/getfeature-wfs.html

Related Question