44 lines
1.4 KiB
JavaScript
44 lines
1.4 KiB
JavaScript
var layer = new ol.layer.TileLayer({
|
|
source: new ol.source.BingMaps({
|
|
key: 'AgtFlPYDnymLEe9zJ5PCkghbNiFZE9aAtTy3mPaEnEBXqLHtFuTcKoZ-miMC3w7R',
|
|
style: 'Aerial'
|
|
})
|
|
});
|
|
|
|
var map = new ol.Map({
|
|
layers: [layer],
|
|
renderer: ol.RendererHint.WEBGL,
|
|
target: 'map',
|
|
view: new ol.View2D({
|
|
center: ol.projection.transform(
|
|
new ol.Coordinate(-9.375, 51.483333), 'EPSG:4326', 'EPSG:3857'),
|
|
zoom: 15
|
|
})
|
|
});
|
|
|
|
var increaseHue = document.getElementById('increase-hue');
|
|
increaseHue.addEventListener('click', function() {
|
|
layer.setHue(layer.getHue() + 0.25);
|
|
}, false);
|
|
var resetHue = document.getElementById('reset-hue');
|
|
resetHue.addEventListener('click', function() {
|
|
layer.setHue(0);
|
|
}, false);
|
|
var decreaseHue = document.getElementById('decrease-hue');
|
|
decreaseHue.addEventListener('click', function() {
|
|
layer.setHue(layer.getHue() - 0.25);
|
|
}, false);
|
|
|
|
var increaseSaturation = document.getElementById('increase-saturation');
|
|
increaseSaturation.addEventListener('click', function() {
|
|
layer.setSaturation(layer.getSaturation() + 0.25);
|
|
}, false);
|
|
var resetSaturation = document.getElementById('reset-saturation');
|
|
resetSaturation.addEventListener('click', function() {
|
|
layer.setSaturation(1);
|
|
}, false);
|
|
var decreaseSaturation = document.getElementById('decrease-saturation');
|
|
decreaseSaturation.addEventListener('click', function() {
|
|
layer.setSaturation(layer.getSaturation() - 0.25);
|
|
}, false);
|