WMTS图层与WMS GetFeatureInfo请求结果错位问题求助

将1米分辨率的栅格数据集切片缓存后以WMTS图层发布，在Web地图展示时，使用WMS GetFeatureInfo请求查询栅格像素值出现错位情况。数据由GeoServer 2.25.2提供服务，WMTS与WMS使用同一坐标系，但仍存在空间微小偏移，部分GetFeatureInfo请求返回null。

返回null的GetFeatureInfo请求示例 #

https://nrri-atlas2.d.umn.edu/geoserver/ows?&REQUEST=GetFeatureInfo&SERVICE=WMS&SRS=EPSG:3857&STYLES=&VERSION=1.1.1&FORMAT=image/png&INFO_FORMAT=application/json&BBOX=-10333651.873837,5735740.039195868,-10333628.789705174,5735755.005625718&HEIGHT=802&WIDTH=1237&LAYERS=nra:dnr_chm_imagemosaic&QUERY_LAYERS=nra:dnr_chm_imagemosaic&X=501&Y=401&FEATURE_COUNT=1

WMTS请求示例 #

https://nrri-atlas2.d.umn.edu/geoserver/gwc/service/wmts/rest/nra:dnr_chm_imagemosaic/nra:dnr_chm_keep/EPSG:900913/EPSG:900913:23/2993680/2031236?format=image%2Fpng

发起GetFeatureInfo请求的JavaScript代码 #

// 构造GetFeatureInfo URL的函数
function getFeatureInfoUrl(bbox, width, height, x, y) {
  return (
    `https://nrri-atlas2.d.umn.edu/geoserver/ows?` +
    `&REQUEST=GetFeatureInfo&SERVICE=WMS&SRS=EPSG:3857` + 
    `&STYLES=&VERSION=1.1.1&FORMAT=image/png&INFO_FORMAT=application/json` +
    `&BBOX=${bbox}&HEIGHT=${height}&WIDTH=${width}` +
    `&LAYERS=nra:dnr_chm_imagemosaic&QUERY_LAYERS=nra:dnr_chm_imagemosaic` +
    `&X=${x}&Y=${y}&FEATURE_COUNT=1`
  );
}

// 处理用户点击获取像素值
view.on("click", function (event) {
  const { mapPoint } = event;

  // 使用地图在EPSG:3857下的范围
  const extent = view.extent;

  // 获取EPSG:3857（Web墨卡托）下的边界框
  const bbox = `${extent.xmin},${extent.ymin},${extent.xmax},${extent.ymax}`;

  // 获取当前视图的尺寸
  const width = view.width;
  const height = view.height;

  // 使用event.screenPoint获取相对于MapView容器的像素坐标
  const x = event.screenPoint.x;
  const y = event.screenPoint.y;

  // 构建GetFeatureInfo URL
  const url = getFeatureInfoUrl(bbox, width, height, x, y);

  console.log("BBOX:", bbox);
  console.log("Width:", width, "Height:", height);
  console.log("X:", x, "Y:", y);
  console.log("GetFeatureInfo URL:", url);
  // 从WMS服务获取像素值
  fetch(url)
    .then((response) => response.json())
    .then((data) => {
      // 从响应中提取像素值
      const feature = data.features ? data.features[0] : null;
      const pixelValue = feature
        ? feature.properties.GRAY_INDEX
        : "无数据";

      // 在弹窗中显示像素值
      view.popup.open({
        title: "像素值",
        content: `点击位置的像素值：${pixelValue}`,
        location: mapPoint, // 在点击位置显示弹窗
      });
    })
    .catch((error) => {
      console.error("获取像素值出错:", error);
    });
}

内容的提问来源于stack exchange，提问作者rumski20