从活动 WMS 层查询像素值

Question

我需要查看单个可见 WMS 的像素值。在我的项目中，我有两个 WMS：

/// WMS sources and layers
var wms_path = 'https://gis.massimilianomoraca.it/geoserver/MassimilianoMoraca/wms';

var sourceNDVI_20150807 = new ol.source.TileWMS({
  url: wms_path,
  params: {
    'LAYERS': 'NDVI_Campania_20150807',
  },
});
var titleNDVI_20150807 = 'NDVI_Campania_20150807';
var layerNDVI_20150807 = new ol.layer.Tile({
  title: titleNDVI_20150807,
  source: sourceNDVI_20150807,
  visible: false
});

var sourceNDVI_20160712 = new ol.source.TileWMS({
  url: wms_path,
  params: {
    'LAYERS': 'NDVI_Campania_20160712',
  },
});
var layerNDVI_20160712 = new ol.layer.Tile({
  title: 'NDVI_Campania_20160712',
  source: sourceNDVI_20160712,
  visible: false
});

我可以在地图上看到这些数据。我创建了下面的函数，目的是激活和停用单层。

<button type="button" class="btn btn-primary"
  onclick="NDVI_Campania_20150807()">NDVI_Campania_20150807</button>
<button type="button" class="btn btn-success"
  onclick="NDVI_Campania_20160712()">NDVI_Campania_20160712</button>


function NDVI_Campania_20150807() {
  console.log('NDVI_Campania_20150807');
  map.removeLayer(layerNDVI_20160712);
  map.addLayer(layerNDVI_20150807);
  layerNDVI_20150807.setVisible(true);

  /// Click on pixel
  map.on('singleclick', function(evt) {
    var coordinate = evt.coordinate;
    var resolution = view.getResolution();
    var projection = 'EPSG:3857';
    var params = {
            'INFO_FORMAT': 'application/json',
          };

    var url_20150807 = sourceNDVI_20150807.getFeatureInfoUrl(
      coordinate, resolution, projection, params
    );
    fetch(url_20150807)
    .then(function (response) {
      return response.text(); })
    .then(function (data) {
      json = JSON.parse(data).features[0];

      ndvi_20150807 = json.properties.GRAY_INDEX;
      date_20150807 = '7 agosto 2015';

      index_20150807 = [1,date_20150807,ndvi_20150807]

    }).catch((error) => {
      console.warn(error)
    });

  });

};

function NDVI_Campania_20160712() {
  console.log('NDVI_Campania_20160712');
  map.removeLayer(layerNDVI_20150807);
  map.addLayer(layerNDVI_20160712);

  layerNDVI_20160712.setVisible(true);
  layerNDVI_20150807.setVisible(false);

  /// Funzione click pixel
  map.on('singleclick', function(evt) {
    var coordinate = evt.coordinate;
    var resolution = view.getResolution();
    var projection = 'EPSG:3857';
    var params = {
            'INFO_FORMAT': 'application/json',
          };

    var url_20160712 = sourceNDVI_20160712.getFeatureInfoUrl(
      coordinate, resolution, projection, params
    );
    fetch(url_20160712)
    .then(function (response) {
      return response.text(); })
    .then(function (data) {

      var json = JSON.parse(data).features[0];

      ndvi_20160712 = json.properties.GRAY_INDEX;
      date_20160712 = '12 luglio 2016';

      index_20160712 = [2,date_20160712,ndvi_20160712]
      console.log(index_20160712);

    }).catch((error) => {
      console.warn(error)
    });

  });

};

我可以激活和取消激活图层，但如果我点击像素，我会看到来自两个图层的数据。如何查看活动图层的像素值？

Answer 1

在您的按钮中，单击处理程序仅更改图层

function NDVI_Campania_20150807() {
  console.log('NDVI_Campania_20150807');
  map.removeLayer(layerNDVI_20160712);
  map.addLayer(layerNDVI_20150807);
  layerNDVI_20150807.setVisible(true);
  layerNDVI_20160712.setVisible(false);
};

function NDVI_Campania_20160712() {
  console.log('NDVI_Campania_20160712');
  map.removeLayer(layerNDVI_20150807);
  map.addLayer(layerNDVI_20160712);
  layerNDVI_20160712.setVisible(true);
  layerNDVI_20150807.setVisible(false);
};

并设置单个地图点击侦听器，用于查询可见的图层

  map.on('singleclick', function(evt) {
    var coordinate = evt.coordinate;
    var resolution = view.getResolution();
    var projection = 'EPSG:3857';
    var params = {
            'INFO_FORMAT': 'application/json',
          };

    if (layerNDVI_20150807.getVisible()) {

      var url_20150807 = sourceNDVI_20150807.getFeatureInfoUrl(
        coordinate, resolution, projection, params
      );
      fetch(url_20150807)
      .then(function (response) {
        return response.text(); })
      .then(function (data) {
        json = JSON.parse(data).features[0];

        ndvi_20150807 = json.properties.GRAY_INDEX;
        date_20150807 = '7 agosto 2015';

        index_20150807 = [1,date_20150807,ndvi_20150807]

      }).catch((error) => {
        console.warn(error)
      });

    } else if (layerNDVI_20160712.getVisible()) {

      var url_20160712 = sourceNDVI_20160712.getFeatureInfoUrl(
        coordinate, resolution, projection, params
      );
      fetch(url_20160712)
      .then(function (response) {
        return response.text(); })
      .then(function (data) {
        var json = JSON.parse(data).features[0];

        ndvi_20160712 = json.properties.GRAY_INDEX;
        date_20160712 = '12 luglio 2016';

        index_20160712 = [2,date_20160712,ndvi_20160712]
        console.log(index_20160712);

      }).catch((error) => {
        console.warn(error)
      });

    }
  });

从活动 WMS 层查询像素值

Query the pixel value from the active WMS layer

javascript

openlayers