Files
openlayers/examples/bind-input.js
2013-09-15 15:51:17 -06:00

59 lines
1.7 KiB
JavaScript

goog.require('ol.Map');
goog.require('ol.RendererHints');
goog.require('ol.View2D');
goog.require('ol.dom.Input');
goog.require('ol.layer.Tile');
goog.require('ol.source.OSM');
goog.require('ol.webgl');
if (!ol.webgl.SUPPORTED) {
var inputs = document.getElementsByClassName('webgl');
for (var i = 0, len = inputs.length; i < len; i++) {
inputs[i].disabled = true;
}
var info = document.getElementById('no-webgl');
/**
* display warning message
*/
info.style.display = '';
}
var layer = new ol.layer.Tile({
source: new ol.source.OSM()
});
var map = new ol.Map({
layers: [layer],
renderers: ol.RendererHints.createFromQueryData(),
target: 'map',
view: new ol.View2D({
center: [0, 0],
zoom: 2
})
});
var visible = new ol.dom.Input(document.getElementById('visible'));
visible.bindTo('checked', layer, 'visible');
var opacity = new ol.dom.Input(document.getElementById('opacity'));
opacity.bindTo('valueAsNumber', layer, 'opacity');
var hue = new ol.dom.Input(document.getElementById('hue'));
hue.bindTo('valueAsNumber', layer, 'hue');
var saturation = new ol.dom.Input(document.getElementById('saturation'));
saturation.bindTo('valueAsNumber', layer, 'saturation');
var contrast = new ol.dom.Input(document.getElementById('contrast'));
contrast.bindTo('valueAsNumber', layer, 'contrast');
var brightness = new ol.dom.Input(document.getElementById('brightness'));
brightness.bindTo('valueAsNumber', layer, 'brightness');
var rotation = new ol.dom.Input(document.getElementById('rotation'));
rotation.bindTo('valueAsNumber', map.getView(), 'rotation');
var resolution = new ol.dom.Input(document.getElementById('resolution'));
resolution.bindTo('valueAsNumber', map.getView(), 'resolution');