Hello,
I tried several of the examples I found online and had the same problem using all of them: the right layer in my layer-swipe is not showing.
Here is my full code and the resulting picture:
<head>
<title> Hallo </title>
<!--
Copyright (c) 2015-2019 Jean-Marc VIGLINO,
released under CeCILL-B (french BSD like) licence: http://www.cecill.info/
-->
<!-- jQuery -->
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<!-- Openlayers -->
<link rel="stylesheet" href="https://openlayers.org/en/latest/css/ol.css" />
<script type="text/javascript" src="https://openlayers.org/en/latest/build/ol.js"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL,Object.assign"></script>
<!-- ol-ext -->
<link rel="stylesheet" href="https://cdn.rawgit.com/Viglino/ol-ext/master/dist/ol-ext.min.css" />
<script type="text/javascript" src="https://cdn.rawgit.com/Viglino/ol-ext/master/dist/ol-ext.min.js"></script>
</head>
<body >
<!-- Map div -->
<div id="map" style="width:600px; height:400px;background-color: grey"></div>
<script type="text/javascript">
// Layers
// Stemen Watercolor
var osm = new ol.layer.Tile({
source: new ol.source.OSM()
});
var stamen = new ol.layer.Tile({
source: new ol.source.Stamen({ layer: 'watercolor' })
});
var label = new ol.layer.Tile({
source: new ol.source.Stamen({ layer: 'terrain-labels' })
});
// The map
var map = new ol.Map({
target: 'map',
view: new ol.View({
zoom: 12,
center: [270701, 6247637]
}),
layers: [stamen,osm,label]
});
// Control
const ctrl = new ol.control.Swipe();
// Set Watercolor on left
//ctrl.addLayer(tileLayer, false);
ctrl.addLayer(stamen);
ctrl.addLayer(label, true);
map.addControl(ctrl);
</script>
</body>
</html>```
Hello, I tried several of the examples I found online and had the same problem using all of them: the right layer in my layer-swipe is not showing. Here is my full code and the resulting picture: