0

Is there a way to bind checkbox change events to a feature select event? For example the following does this for layer visibility.

<input type="checkbox" id="visible" checked>
var visible = new ol.dom.Input(document.getElementById('visible'));
visible.bindTo('checked', layer, 'visible');

I want to allow users to select features from a table.

Jonatas Walker
  • 13,583
  • 5
  • 53
  • 82
MoreScratch
  • 2,933
  • 6
  • 34
  • 65

1 Answers1

0

Fiddle

function getLayerByName(value) {
  var layer;
  var found = map.getLayers().getArray().some(function(each){
    //discard layers other than ol.layer.Vector
    if(each instanceof ol.layer.Vector) {
        layer = each.get('name') === value ? each: undefined;
    }
    if(layer) return true;
    return false;
  });
  return layer ? layer : false;
}

function toggleVisibility(element) {
  var layer = getLayerByName(element.value);
  if (element.checked) {
    layer.setVisible(true);
  } else {
    layer.setVisible(false);
  }
}
Jonatas Walker
  • 13,583
  • 5
  • 53
  • 82
  • Thanks however that doesn't explain how I am going to bind the checkbox to the feature select event. Can you elaborate? Many thanks. – MoreScratch Aug 15 '16 at 13:19
  • Sorry Jonatas I don't think I have explained the problem very well. Here is what I am doing. For every feature that gets rendered, I am creating a row in a table with a corresponding checkbox for each row. When a user checks the checkbox I need the select control to select the feature on the map. Conversely, when a user selects a feature on the map I need the corresponding checkbox in the table to be checked. I don't need to worry about layer visibility - the layer is always visible. – MoreScratch Aug 15 '16 at 14:48