OpenLayers 3(3.3.0)一次选择一个功能
使用openlayer 3.3.0,我们将地图分为几个县,每个县都是一个“特征”,我想选择一个特征并更改其边界颜色,当我选择另一个特征时,我想将先前选择的特征恢复为其原始样式,并将新特征应用于所选样式 所以我用这个来添加交互OpenLayers 3(3.3.0)一次选择一个功能,openlayers,openlayers-3,angular-openlayers,Openlayers,Openlayers 3,Angular Openlayers,使用openlayer 3.3.0,我们将地图分为几个县,每个县都是一个“特征”,我想选择一个特征并更改其边界颜色,当我选择另一个特征时,我想将先前选择的特征恢复为其原始样式,并将新特征应用于所选样式 所以我用这个来添加交互 var select = new ol.interaction.Select({ condition: ol.events.condition.click, }); select.on('select', function(evt)
var select = new ol.interaction.Select({
condition: ol.events.condition.click,
});
select.on('select', function(evt){
var features = evt.target.getFeatures();
features.forEach(function(feature){
feature.setStyle(new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#007aa9',
width: 1.5;
}))
}
})
map.addInteraction(select);
这一切都很好,但它不会“取消选择”以前选择的功能,因此,如果我在所有功能周围单击,将获得选择样式
我能解决这个问题的唯一方法是,设置一个“previouslySelectedFeature”变量,并在“on”事件中重置其样式,这似乎有点笨拙,是否应该有一种方法来检测功能何时被“取消选择”并重置其样式?看起来解决方案可能是更新到版本3.4(它在3.3中不起作用)然后您可以访问“选定”和“取消选定”属性。 所以我重构了我的事件代码
select.on('select', function(evt){
var selectedFeatures = evt.selected;
selectedFeatures.forEach(function(feature){
feature.setStyle(new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#007aa9',
width: 1.5;
}));
});
var deselectedFeatures = evt.deselected;
deselectedFeatures.forEach(function(feature){
feature.setStyle(new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#000000',
width: 0.4;
})
})
});
});
对还是错