Uncaught TypeError: Cannot read property 'Inpu

Question

I changed from OpenLayers v3.0.0 to 3.19.1 and now following line doesn't work:

var visible = new ol.dom.Input(document.getElementById('visible'));

Switching back to the older version, everything is ok. What's going wrong?

Answer 1

ol.dom.Input was removed in 3.5.0

The experimental ol.dom.Input component has been removed. If you need to synchronize the state of a dom Input element with an ol.Object, this can be accomplished using listeners for change events. For example, you might bind the state of a checkbox type input with a layer's visibility like this:

var layer = new ol.layer.Tile();
var checkbox = document.querySelector('#checkbox');

checkbox.addEventListener('change', function() {
  var checked = this.checked;
  if (checked !== layer.getVisible()) {
    layer.setVisible(checked);
  }
});

layer.on('change:visible', function() {
  var visible = this.getVisible();
  if (visible !== checkbox.checked) {
    checkbox.checked = visible;
  }
});