SLD based selection on WMS layers - How to set the new style of a clicked point?

Question

I'm trying to follow this example: http://openlayers.org/dev/examples/SLDSelect.html

When I click on the point, its color should be changed, here is a piece of my code:

control =  new OpenLayers.Control.SLDSelect(
                    OpenLayers.Handler.Click,
                    {
                        //displayClass: 'olControlClick',
                        layers: [city]
                    }
                )

                map.addControl(control);
                 control.activate();

Still can't figure out what's the point of displayClass. and how to assign the new color.

Answer 1

displayClass is the css class that gets used when the SLDSelect control is active. To play around with it and see what html element is being modified, try setting the class like this:

   .olControlClick {
       cursor: crosshair;
       background-color: yellow;
       border: 5px solid green;
   }

When you refresh your browser page, you may see the flash of yellow background as the layer renders, you will see a cross-hair cursor, and you will see the large green border on the div that uses the css class.

Use this to modify the characteristics of the map div when the SLDSelect control is active.

You can play around with this by calling activate() and deactivate() on your SLDSelect control. When the control is not active (after calling deactivate()), you won't see the artifacts of the css style (no green border, no cross-hair cursor). When the control is active, you will see these 2 style properties (border and cursor).

This example may be useful, make sure you view the source to see the javascript.