は、これが私のコードであるgeoserver

Question

var element = document.getElementById('popup'); 
var popup = new ol.Overlay({ 
      element: element, 
      positioning: 'bottom-center', 

      stopEvent: false 
     }); 
     map.addOverlay(popup); 
var Source_ATM = 
     new ol.source.TileWMS({ 
     url: 'http://localhost:8080/geoserver/BMC/wms', 
     params: { 
      'LAYERS': 'BMC:atm', 
      'VERSION': '1.1.0', 
      'FORMAT': 'image/png', 
      'TILED': true 
     }, 
     id:"atm", 
     serverType:'geoserver' 
     }); 


    var Layer_ATM = new ol.layer.Tile({ 
     source: Source_ATM, 

    }); 

    Layer_ATM.setVisible(false); 

    //block_boundary Layer 
    var Source_BlockBoundary = 
     new ol.source.TileWMS({ 
     url: 'http://localhost:8080/geoserver/BMC/wms?', 
     params: { 
      'LAYERS': 'BMC:block_boundary', 
      'VERSION': '1.1.0', 
      'FORMAT': 'image/png', 
      'TILED': true 
     }, 
     id:"block_boundary", 
     serverType:'geoserver' 
    }); 

    var Layer_block_boundary = new ol.layer.Tile({ 
     source: Source_BlockBoundary, 

    }); 

    Layer_block_boundary.setVisible(false); 
    function featureinfoFun() { 

        map.on('singleclick', function (evt) { 

         var view = map.getView(); 
         var viewResolution = view.getResolution(); 

         var source = Layer_block_boundary.getSource(); 
         //var source2=Layer_test.getSource(); 

         var url = source.getGetFeatureInfoUrl(
         evt.coordinate, viewResolution, view.getProjection(), 
         { 'INFO_FORMAT': 'text/html', 'FEATURE_COUNT': 50 }); 

         if (url) { 
          var coordinate = evt.coordinate; 
          popup.setPosition(coordinate); 
          $(element).popover("destroy"); 
          $(element).popover({ 
           'placement': 'top', 
           'html': true, 
           'content': '<iframe style="width: 105%;"seamless src="' + url + '"></iframe>' 

          }); 

          $(element).popover('show'); 
          $(element).css('display', 'block'); 
          //$(element).popup.classList.toggle('show'); 
          //$(element).popup.close(); 
         } 
        }); 
      } 

.ol-popup { 
      position: absolute; 
      background-color: white; 
      -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2)); 
      filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2)); 
      padding: 15px; 
      border-radius: 10px; 
      border: 1px solid #cccccc; 
      bottom: 12px; 
      left: -50px; 
      min-width: 280px; 
      } 
      .ol-popup:after, .ol-popup:before { 
      top: 100%; 
      border: solid transparent; 
      content: " "; 
      height: 0; 
      width: 0; 
      position: absolute; 
      pointer-events: none; 
      } 
      .ol-popup:after { 
      border-top-color: white; 
      border-width: 10px; 
      left: 48px; 
      margin-left: -10px; 
      } 
      .ol-popup:before { 
      border-top-color: #cccccc; 
      border-width: 11px; 
      left: 48px; 
      margin-left: -11px; 
      } 
      .ol-popup-closer { 
      text-decoration: none; 
      position: absolute; 
      top: 2px; 
      right: 8px; 
      } 
      .ol-popup-closer:after { 
      content: "✖"; 
      } 

<div id="map1" class="map" style="position: fixed; height:100%; margin-top: 28px;"> 

        <!--div class="ol-toggle-options ol-unselectable"><a title="Toggle options toolbar" onClick="toggleControlPanel()" href="#toggle"></a></div--> 

        <div id="popup" class="ol-overlay-container" style="width:200px;height: 0px;"> 
        <a href="#" id="popup-closer" class="ol-popup-closer"></a> 
         <div id="popup-content" class="popover-content"></div> 

を使用して表示しました。両方のレイヤの機能情報を表示するのを手伝ってください。コードで私を助けてください。私は複数の層を表示したいと私は層と他の層の上にクリックしたとき、それはあなたが getFeatureInfoリクエストを作成する必要がありますいずれかの両方の層からの情報を表示するには層の両方のためにgeoserverから

Answer 1

来る属性情報を表示します。 （各層ごとに1つ）。または、LAYERS & QUERY_LAYERSのパラメータをコンマで区切ったレイヤー名のリストに設定して、リクエスト内の2つのレイヤーを組み合わせることもできます（スタイルを指定する場合は、両方のスタイル名をSTYLESパラメータに追加する必要があります）。

これを行う最も簡単な方法は、あなたには、いくつかのコーディング例で私を助けてくださいすることができgetFeatureInfoUrl