8

It is possible to change the color of highlightCtrl when I use onselectedHover? Default is light blue.

I want to change it to another one eg. red? Does anyone know where this value is defined?

1
  • Problem solved !! I've just added new style in OpenLayers.StyleMap. I had specific styles for: 'default', 'select' and now i've added also 'temporary' which is responsible for highlightCtrl style. Hope this is helpfull for someone else too.
    – Alex
    Dec 15, 2011 at 12:08

2 Answers 2

19

When you define your layer you could specify your styleMaps as well:

_layer = new OpenLayers.Layer.Vector("My Layer Name", {
    styleMap: new OpenLayers.StyleMap({
        "default": new OpenLayers.Style({
            strokeColor: "#ff0000",
            strokeOpacity: .7,
            strokeWidth: 1,
            fillColor: "#ff0000",
            fillOpacity: 0,
            cursor: "pointer"
        }),
        "temporary": new OpenLayers.Style({
            strokeColor: "#ffff33",
            strokeOpacity: .9,
            strokeWidth: 2,
            fillColor: "#ffff33",
            fillOpacity: .3,
            cursor: "pointer"
        }),
        "select": new OpenLayers.Style({
            strokeColor: "#0033ff",
            strokeOpacity: .7,
            strokeWidth: 2,
            fillColor: "#0033ff",
            fillOpacity: 0,
            graphicZIndex: 2,
            cursor: "pointer"
        })
    })
});

Then specify your renderintent:

_highlightControl = new OpenLayers.Control.SelectFeature(layer, {
    hover: true,
    highlightOnly: true,
    renderIntent: "temporary"
});
2
  • thanks, as I mentioned before I solved the problem, exactly as you say, thanks anyway
    – Alex
    Dec 20, 2011 at 8:32
  • 7
    @Alex: Since you're new here, let me explain how this works. If you get to solve your own answer, then answer it. And mark the answer as 'answered'. You have made a comment which lacks example and proper explanation. I figured if anyone searching has the same question as you did, they will appreciate having an answer that will be helpful to them.
    – CaptDragon
    Dec 20, 2011 at 14:10
1

The other way is to edit directly the style.css archive in the ol/Theme/default directory of your Openlayers library. Look for this code and edit it:

.olHandlerBoxSelectFeature {
border: 2px solid blue;
position: absolute;
background-color: white;
opacity: 0.50;
font-size: 1px;
filter: alpha(opacity=50);}   

Hope this will be useful to you.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.