How to show a point on mouse over a hidden polygon?

Question

Any suggestions on how to show a point on mouse over a hidden polygon?

A single kml file contains two polygons and two points as in the image, I've hidden these polygon and point by setting stylemap fill color, is there any way to show the points on mouse over the hidden polygon.

Any guidance and help is appreciated.

Thanks in advance.

Answer 1

One way is to trigger styled render intent using OpenLayers.Control.SelectFeature

Here is a demo which allows the line vertices (points) to become visible on hover.

UPDATE:

The key is to define a stylemap with two render intents, a default one, and another one for the hover style. Then set event listeners on the highlight control which will listen for the polygon, but trigger the highlight/unhighlight of the point.

HERE is a new DEMO that accomplishes what you want to do.

var polygonLayer = new OpenLayers.Layer.Vector("Polygons", {
    styleMap: new OpenLayers.StyleMap({
        "default": new OpenLayers.Style({
            strokeColor: 'Transparent', // change this to strokeColor: '#0000cc', to see the polygons
            fillColor: 'Transparent'
        }),
        "temporary": new OpenLayers.Style({
            strokeColor: 'Transparent', // change this to strokeColor: '#0000cc', to see the polygons
            fillColor: 'Transparent'
        })
    })
});

var pointLayer = new OpenLayers.Layer.Vector("Points", {
    styleMap: new OpenLayers.StyleMap({
        "default": new OpenLayers.Style({
            strokeColor: 'Transparent',
            fillColor: 'Transparent',
            pointRadius: 6
        }),
        "temporary": new OpenLayers.Style({
            strokeColor: '#0000cc',
            fillColor: '#0000cc',
            strokeOpacity: .8,
            strokeWidth: 1,
            fillOpacity: .3,
            cursor: "default",
            pointRadius: 6
        })
    })
});