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?

Answer 1

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

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.