2015-09-30 1 views
0

En utilisant openlayer 3.3.0, nous avons une carte divisée en comtés, chaque comté est une 'fonctionnalité', je veux sélectionner une caractéristique et changer sa couleur de bordure, Lorsque je sélectionne une autre fonction, je souhaite que la fonction précédemment sélectionnée revienne à son style d'origine et que la nouvelle fonctionnalité applique le style sélectionné. Donc, je l'utilise pour ajouter les interactions.OpenLayers 3 (3.3.0) Sélectionnez Caractéristique un à la fois

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); 

Tout cela fonctionne très bien, mais il n'a pas «unselect la fonction précédemment sélectionnée, donc si je clique autour de toutes les fonctionnalités sont le style de sélection

La seule façon dont je peux sembler résoudre ce problème est, pour définir une variable 'previousSelectedFeature', et réinitialiser son style dans l'événement 'on', il semble un peu maladroit cependant, ne devrait pas y avoir un moyen de détecter quand une fonctionnalité a été «désélectionnée» et réinitialiser son style?

Répondre

0

Apparaîtra la solution pourrait être de mettre à jour à la version 3.4 (cela ne fonctionne pas dans 3.3) et puis vous avez accès aux propriétés «sélectionnées» et «désélectionnées». Je mon code remaniée avec événement

  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; 
         }) 
        }) 
       }); 
      }); 

Vrai ou faux?