我有多个 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()
//GET URL (working)
var district_url=india_dist_maximum_temperature_layer.getSource().getFeatureInfoUrl()