2-й слой не подходит - PullRequest
Новая
       26

2-й слой не подходит

0 голосов
/ 17 мая 2019

На основе образца https://openlayers.org/en/latest/examples/popup.html Я хочу добавить еще один слой, чтобы показать больше информации.1-й слой выглядит нормально, но 2-й не появляется

Я попытался настроить код, чтобы добавить этот слой 

  var attribution = new ol.control.Attribution({
  collapsible: false
  });

 var map = new ol.Map({
 controls: ol.control.defaults({attribution: false}).extend([attribution]),
 layers: [
     new ol.layer.Tile({
         source: new ol.source.OSM({
             url: 'https://tile.openstreetmap.be/osmbe/{z}/{x}/{y}.png',
             maxZoom: 18
         })
     })
 ],
 target: 'map',
 view: new ol.View({
     center: ol.proj.fromLonLat([4.35247, 50.84673]),
     maxZoom: 18,
     zoom: 12
    })
    });

    /* Adding 1st overlay */

    var layer = new ol.layer.Vector({
    source: new ol.source.Vector({
    features: [
    new ol.Feature({
        geometry: new ol.geom.Point(ol.proj.fromLonLat([4.35247, 50.84673]))
    })
    ]
    })
    });
    map.addLayer(layer);

    var container = document.getElementById('popup');
    var content = document.getElementById('popup-content');

     var overlay = new ol.Overlay({
         element: container,
         autoPan: true,
         autoPanAnimation: {
             duration: 250
         }
     });
     map.addOverlay(overlay);

    content.innerHTML = '<b>Hello world!</b><br />I am 1st popup.';
    overlay.setPosition(ol.proj.fromLonLat([4.35247, 50.84673]));

    /* Adding 2nd overlay */
    var layer1 = new ol.layer.Vector({
    source: new ol.source.Vector({
    features: [
    new ol.Feature({
        geometry: new ol.geom.Point(ol.proj.fromLonLat([4.35247, 50.81673]))
    })
    ]
    })
    });
    map.addLayer(layer1);


    var container1 = document.getElementById('popup1');
    var content1 = document.getElementById('popup-content1');

     var overlay1 = new ol.Overlay({
         element: container1,
         autoPan: true,
         autoPanAnimation: {
             duration: 250
         }
     });
     map.addOverlay(overlay1);

    content1.innerHTML = '<b>Hello world 2!</b><br />I am 2nd popup.';
    overlay1.setPosition(ol.proj.fromLonLat([4.35247, 50.81673]));

Я ожидаю 2 всплывающих окна.Рабочий код можно увидеть здесь: https://www.corobori.com/sos/testmap.html

...