Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

Reading this post How to add KML data but from variable - not from url? I changed the way of reading KML files (from HTTP to a string loaded using jQuery)

/**
 * The OpenLayers object
 * @type {OpenLayers.Projection}
 * @var
 */
var geographic = new OpenLayers.Projection('EPSG:4326');

/**
 * The OpenLayers object
 * @type {OpenLayers.Projection}
 * @var
 */
var mercator = new OpenLayers.Projection('EPSG:900913');

****
success: function(data) {
    if (data != '') {
        var format = new OpenLayers.Format.KML({
            'internalProjection': mercator, //EPSG:3785/900913
            'externalProjection': geographic, //EPSG:4326
            extractStyles: true,
            extractAttributes: true
        });
        sFeatures = format.read(data);
    }
}

I would like to use the icons that come from the KML string, but when I click on a feature I would like to increase the size of the icon or even change it.

My Layer definition:

var hydrographsLayerVector = new OpenLayers.Layer.Vector('hydrographs', {
    //renderers: renderer,
    styleMap: new OpenLayers.StyleMap({
        "default": new OpenLayers.Style(OpenLayers.Util.applyDefaults({
            externalGraphic: "http://openlayers.org/dev/img/marker-green.png",
            graphicOpacity: 1,
            rotation: -45,
            pointRadius: 10
        }, OpenLayers.Feature.Vector.style["default"])),
        "select": new OpenLayers.Style({
            externalGraphic: "http://openlayers.org/dev/img/marker-blue.png"
        })
    })
});

If I remove the lines extractStyles and extractAttributes = true I see the effect using the styleMap defined in the new OpenLayers.Layer.Vector('hydrographs'*.

How can I use the styleMap:"select": if I use extractStyles and extractAttributes = true? Ideally, I would like to increase the size of the feature onmouseover and if the user clicks on it I want to keep the bigger size until the "unFeatureUnSelected".

Thanks!

share|improve this question

2 Answers 2

up vote 1 down vote accepted

Check my answer on stackoverflow on this subject. You have to switch extractStyles to false and work with the extracted attributes. Also, you need to map styles on a stylemap, I've put a lengthy answer in there with rules.

share|improve this answer

this codes can help you.

    var selectCtrl = new OpenLayers.Control.SelectFeature(vectors,
            {clickout: true}
        );

    map.addControl(selectCtrl);            
    selectCtrl.activate();

    vectors.events.on({
        featureselected: function (e) {
            console.log(e.feature.id);
            e.feature.style.pointRadius = 10;
            //or do what you want
            vectors.redraw();               
        },
        featureunselected: function (e) {
            console.log(e.feature.id);
            e.feature.style.pointRadius = 3;
            //or do what you want
            vectors.redraw();               
        }      
    });

i hope it helps you...

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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