Overwrite style properties on select in OpenLayers

Question

I want to reuse my basic style function to create an select style by overwriting some of the properties. This approach is working for fill/stroke colors of linestrings, polygons and texts, but not for images (a circle in my case). I don't want to create a new image since other properties should be retained.

var selectStyleFunction = function(feature, resolution) {
  var style = styleFunction(feature, resolution)[0];
  style.getImage().getFill().setColor("magenta");

  console.log(style.getImage().getFill().getColor());

  return [style];
};

In this fiddle you can see, that the above code doesn't change the feature style on selection although the log output is correct.

Is there any way to overwrite this property?

There's a discussion about this: github.com/openlayers/openlayers/issues/5775 — Chase Choi
Thank you for your answer, but i don't see where this discussion relates to my problem. As i understand it, it's about efficiency when drawing circles. — anste
As you can see the referenced issue github.com/openlayers/openlayers/issues/6233 there may be some kind of information. — Chase Choi
That's the information i needed. I have to change the radius to force rerendering. You can create an answer if you want, so i can accept it. — anste

anste anste · Accepted Answer · 2017-09-01T06:28:32

I found an answer to my question in the api dokumentation of openlayers. It was too obvious to find it in the first place.

https://openlayers.org/en/latest/apidoc/ol.style.Style.html

ol.style.Style
Container for vector feature rendering styles. Any changes made to the style or its children through set*() methods will not take effect until the feature or layer that uses the style is re-rendered.

So rendering is not triggered by the setters.

Overwrite style properties on select in OpenLayers

1 Answers