0

我有多个 Geoserver 层,这里放 3 个(降雨、最高温度和最低温度)

层的名称和在单选按钮中分配的用于切换层的值是相同的。

当我检查单选按钮时,我得到了该特定层的值

但是当我传递这个值时,我无法获取该层的 URL

如何使该层值字符串在 Openlayers 6 的GetFeatureInfo函数中工作,以获取我们从侧边栏中选择的特定层的 URL?

任何其他建议都将受到高度赞赏。

<body>
   <div class="grid-container">
        <div class="grid-1">
            <div class="sidebar">
                <h3>Weather Parameters</h3>
          <input type="radio" name="WeatherParameterLayerRadioButton" value="india_dist_rainfall_layer" checked> Rainfall <br>
          <input type="radio" name="WeatherParameterLayerRadioButton" value="india_dist_maximum_temperature_layer"> Maximum Temperature <br>
          <input type="radio" name="WeatherParameterLayerRadioButton" value="india_dist_minimum_temperature_layer"> Minimum Temperature <br>                
            </div>
            <div class="grid-2">
                <div id= 'js-map' class='map'></div>
            </div>
   </div>
</body>
window.onload = init;

function init(){

    // 1.1 Rainfall
    var india_dist_rainfall_layer_source = new ol.source.TileWMS({
        url: "http://localhost:8080/geoserver/agrodss/wms",
        params: {"LAYERS":" agrodss:Rainfall (mm)", "tiled": true},
        serverType: "geoserver",
    })
    var india_dist_rainfall_layer = new ol.layer.Tile({
        source: india_dist_rainfall_layer_source, 
        opacity: 0.0,
        visible:true,
        title: "Rainfall"
    })

    // 1.2 Maximum Temperature
    var india_dist_maximum_temperature_layer_source = new ol.source.TileWMS({
        url: "http://localhost:8080/geoserver/agrodss/wms",
        params: {"LAYERS":"agrodss:Maximum Temperature (°C)", "tiled": true},
        serverType: "geoserver",
    })
    var india_dist_maximum_temperature_layer = new ol.layer.Tile({
        source: india_dist_maximum_temperature_layer_source, 
        opacity: 0.0,
        visible:true,
        title: "Maximum_Temperature"
    })

    var myview = new ol.View({
        center: ol.proj.fromLonLat([80, 22]),
        zoom: 3, 
        maxZoom: 9,
        minZoom: 2,
      });

    var map = new ol.Map({
        target: 'js-map',
        view: myview,
    });

    var weatherParameterLayerGroup = new ol.layer.Group({
      layers: [ 
        india_dist_rainfall_layer, 
        india_dist_maximum_temperature_layer
      ]
    })


map.on('click',function(evt){
      var resolution=map.getView().getResolution();
      var coordinate=evt.coordinate;    
      var projection=map.getView().getProjection();
      //console.log(resolution, coord, projection)

//switching layers to get layer value
      var weatherParameterLayerURLs = document.querySelectorAll('.sidebar > input[type=radio]');
      for (let weatherParameterLayerURL of weatherParameterLayerURLs){
      weatherParameterLayerURL.addEventListener('change', function(){
      var weatherParameterLayerURLpass = this.value;
      //GET URL (not working)
      var district_url=weatherParameterLayerURLpass.getSource().getFeatureInfoUrl()

496

      //GET URL (working)
      var district_url=india_dist_maximum_temperature_layer.getSource().getFeatureInfoUrl()

在职的

4

1 回答 1

0

如果您有 GetFeatureInfo URL,您可以在 GetMap URL 上获取,只需将请求参数的值从GetFeatureInfo更改为GetMap

于 2021-01-25T10:23:43.257 回答