Remover os recursos selecionados Openlayers 3

Estou usando o openlayers 3 para criar aplicativos da web que permitem ao usuário desenhar recursos de LineString no mapa. este é o código:

var raster = new ol.layer.Tile({
source: new ol.source.MapQuest({ layer: 'sat' })
});


var source = new ol.source.Vector();

var vector = new ol.layer.Vector({
    name: 'my_vectorlayer',
    source: source,
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: '#ffcc33',
            width: 5
        })
    })
});

var map = new ol.Map({
    layers: [raster, vector],
    target: document.getElementById('map'),
    view: new ol.View2D({
        center: [-11000000, 4600000],
        zoom: 4
    })

});
var draw;
function addInteraction() {
 map.removeInteraction(singleClick);
    draw = new ol.interaction.Draw({
        source: source,
        type: ("LineString")
    });
    map.addInteraction(draw);
}

pelo código anterior eu posso arrastar linhas para o mapa. as linhas desenhadas serão adicionadas à vectorcamada. Quando o usuário seleciona uma das linhas que ele desenha, não o removo. este é o código para selecionar o recurso:

var singleClick = new ol.interaction.Select();
function addSelect() {
    map.removeInteraction(draw);
    map.addInteraction(singleClick);
}

e é muito trabalho,

Eu só quero que o usuário possa remover o LineString selecionado ...

Sim, você pode remover o recurso selecionado.

var draw;
var featureID = 0;
var singleClick;
var selectedFeatureID;

// First some change in this function.

function addInteraction() {
   map.removeInteraction(singleClick);

      draw = new ol.interaction.Draw({
      source: source,
      type: ("LineString")
  });

 // Create drawend event of feature and set ID to feature

  draw.on('drawend', function (event) {
    featureID = featureID + 1;
    event.feature.setProperties({
        'id': featureID
    })
 })
   map.addInteraction(draw);
 }

Em seguida, altere em selecione Função da seguinte maneira:

 function addSelect() {
    map.removeInteraction(draw);
    singleClick = new ol.interaction.Select();
    map.addInteraction(singleClick);

     singleClick .getFeatures().on('add', function (event) {
     var properties = event.element.getProperties();
     selectedFeatureID = properties.id;       
    });
 }

Em seguida, chame esta função no botão REMOVER e clique em

 function removeSelectedFeature() {
   var features = source.getFeatures();
     if (features != null && features.length > 0) {
         for (x in features) {
            var properties = features[x].getProperties();
            console.log(properties);
            var id = properties.id;
            if (id == selectedFeatureID) {
              source.removeFeature(features[x]);
               break;
            }
          }
        }
      }

Com esse código, você pode remover qualquer recurso selecionado. Se for Linha, Ponto, Polígono etc.

Primeiro, se você puder me dar mais alguns detalhes, eu poderia ajudá-lo melhor a responder sua pergunta. Acho que não entendo completamente o que você está perguntando. Aqui estão algumas possibilidades.

1) A solução simples, porém limitada, é apenas usar um alternador de camadas. Algo como este . Supondo que você esteja usando um wms como geoserver, é possível usar visualizações semelhantes a SQL para criar várias camadas que você pode adicionar ou remover. Se você precisar fazer algo simples como esse, posso editar a resposta para fornecer mais detalhes.

2) Eu não tenho feito isso antes, mas isso pode ser algo para olhar para . Basicamente, você usará o ol.format.wfs para selecionar e excluir recursos.