Hallo,
kann mir einer Helfen wie ich mit Radio Buttons die Bilder wechsel in Openlayers 3?
Mein Code:
<div id="tree" class="span2">
<fieldset id="layerA">
<label class="radio" for="bild-switch_1">
<input id="bild-switch_1" class="bild-switch_1a" type="radio" name="bilder" value="bild1" onchange="checkedRadioBtn()" checked />Bild1
</label>
<label class="radio" for="bild-switch_2">
<input id="bild-switch_2" class="bild-switch_1a" type="radio" name="bilder" value="Bild2" onchange="checkedRadioBtn()" />Bild2
</label>
<label class="radio" for="bild-switch_3">
<input id="bild-switch_3" class="bild-switch_1a" type="radio" name="bilder" value="Bild3" onchange="checkedRadioBtn()" />Bild3
</label>
</fieldset>
</div>
Javascript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
function checkedRadioBtn(){
var newL;
if(document.getElementById("bild-switch_1").checked){
newL = new ol.layer.Image({
source: new ol.source.ImageStatic({
url: 'Bild1.png',
imageSize: [122, 44],
projection: proj,
imageExtent: proj.getExtent()
})
});
}else if(document.getElementById("bild-switch_2").checked){
newL = new ol.layer.Image({
source: new ol.source.ImageStatic({
url: 'Bild2.png',
imageSize: [722, 154],
projection: proj,
imageExtent: proj.getExtent()
})
});
...
map.removeLayer(baseLayer);
map.addLayer(newL);
};
Dies funktioniert bei mir, er switch die Bilder, aber mir ist aufgefallen, dass er nicht das vorherige Bild entfernt sondern er fügt einfach das Bild auf das vorherige oben drauf. Wie kriege ich das hin, dass dies nicht passiert?
Hier ein Link zu meinem kompletten Code.
http://jsfiddle.net/B9qkU/
Ich bedanke mich im Voraus!
Last edited: 2014-05-22 09:24:30 +0200 (CEST)