openlayers3 тот же стиль для выбранных объектов (только одно измененное свойство)?
У меня есть слой ol3 с определением стиля. Я хотел бы использовать тот же стиль для взаимодействия выбора:
style = function(feature, resolution) {
var iconFont = 'FontAwesome';
var iconFontText = '\uf1f8'; // fa-trash
var iconSize = 24;
var col = 'black';
var styles = [];
var styleIcon = new ol.style.Style({
text: new ol.style.Text({
font: 'Normal ' + iconSize + 'px ' + iconFont,
text: iconFontText,
fill: new ol.style.Fill({color: col})
})
});
styles.push(styleIcon);
}
return styles;
};
new ol.layer.Vector({
source: that.source,
style: style
});
new ol.interaction.Select({
features: that.selectedFeatures,
style: style
})
Я хочу изменить только одно свойство (iconSize) стиля, чтобы выделить выбранные функции. Это как-то возможно? Я не хочу определять два отдельных стиля, но было бы неплохо, если бы можно было программным образом скопировать стиль и заменить значение iconsize.
2 ответа
Решение
Теперь я нашел рабочее решение:
Вы можете добавить дополнительный аргумент (например, highlight [bool]) для функции стиля:
style = function(feature, resolution, highlight) {
...
}
и вместо
new ol.interaction.Select({
features: that.selectedFeatures,
style: style
})
ты можешь использовать
new ol.interaction.Select({
features: that.selectedFeatures,
style: function(feature,resolution){
return style(feature,resolution,true);
}
})
Возможное решение: сообщите вашей функции, что ol.interaction.Select
активен:
var style = function(ft, res, selecting){
return [
new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#ffcc33',
width: selecting ? 4 : 2
})
})
];
};
var selecting = false;
selectInteraction.on('select', function(evt) {
selecting = evt.selected.length > 0;
});