Openlayers: ol.interaction.Select: style option doesn't take effect when feature has style

[anzhihun]

Description as title. To show this issue, I create a demo on jsfiddle. The blue feature will be changed to red after selected. But the green feature will not. Because the green feature has its own style. Is it intended? Or is it a bug? Thanks !

[MV88]

Any comment? Can this be applied also to ol.Interaction.Modify?

[ahocevar]

This is intended. A feature style will always override a style defined on a layer or an interaction. There are several ways to achieve what you want. I created an update JSFiddle that shows one of them: https://jsfiddle.net/rdztsnwe/4/. Basically what you do is this:

var selectStyle = new ol.style.Style(/* ... */);
var select = new ol.interaction.Select({
  style: selectStyle;
});
function selectableStyle(style) {
  return function() {
    return select.getFeatures().getArray().indexOf(this) == -1 ? selectStyle : style
  }
};
var feature = new ol.Feature(/* ... */);
feature.setStyle(selectableStyle(new ol.style.Style(/* ... */)));

[MV88]

Yeah, thanks for the quick answer. I found this resource that helped me. http://stackoverflow.com/questions/32524122/how-to-apply-a-style-to-the-modify-interaction-in-openlayers-3

[NewITCorp]

"A feature style will always override a style defined on a layer or an interaction."

do I understand it correctly, that we cannot use both style altogether but rather move it to a (dynamic) feature style alone?