3

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!

2

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.

1

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...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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