如何在WMS图层中设置弹窗信息模板？（附ArcGISDynamicMapServiceLayer示例）

当然可以实现！不过WMS图层和你之前用的ArcGIS动态服务图层机制不太一样——它没有内置的setInfoTemplates方法，得通过手动监听点击事件、获取要素信息再构建弹窗的方式来达到类似效果。下面是具体的实现步骤和代码示例：

1. 创建并添加WMS图层 #

首先先把你的WMS图层添加到地图上：

// 实例化WMS图层
const wmsLayer = new WMSLayer({
  url: "你的WMS服务地址",
  layers: "目标图层的名称/ID" // 对应WMS服务中的图层标识
});
// 添加到地图
map.add(wmsLayer);

2. 定义弹窗模板 #

和你之前用的InfoTemplate用法一致，提前定义好弹窗的标题和内容格式：

const wmsInfoTemplate = new InfoTemplate({
  title: "*你的弹窗标题*",
  content: "属性1: ${attr1}<br>属性2: ${attr2}<br>属性3: ${attr3}"
  // 这里的${字段名}要和WMS服务返回的属性字段对应
});

3. 监听地图点击事件，获取要素信息并弹窗 #

WMS是栅格服务，默认不会主动返回要素属性，所以我们需要通过WMS GetFeatureInfo请求来获取点击位置的要素信息，再结合InfoTemplate展示弹窗：

// 监听地图点击事件
map.on("click", (event) => {
  // 构建GetFeatureInfo请求参数
  const infoParams = new WMSGetFeatureInfoParameters();
  infoParams.layerIds = wmsLayer.layerIds;
  infoParams.layerOptions = wmsLayer.layerOptions;
  infoParams.width = map.width;
  infoParams.height = map.height;
  infoParams.geometry = event.mapPoint; // 点击的地图点位
  infoParams.mapExtent = map.extent; // 当前地图范围
  infoParams.infoFormat = "application/json"; // 请根据WMS服务支持的格式调整，比如text/html、application/xml等

  // 创建GetFeatureInfo任务
  const getFeatureInfoTask = new WMSGetFeatureInfoTask(wmsLayer.url);

  // 执行请求并处理响应
  getFeatureInfoTask.execute(infoParams)
    .then((response) => {
      // 解析响应数据（以JSON格式为例）
      const featureData = JSON.parse(response).features[0];
      const featureAttributes = featureData.attributes;

      // 创建Graphic对象承载属性，用于关联InfoTemplate
      const popupGraphic = new Graphic({
        attributes: featureAttributes,
        infoTemplate: wmsInfoTemplate
      });

      // 打开弹窗
      map.infoWindow.setFeatures([popupGraphic]);
      map.infoWindow.show(event.mapPoint);
    })
    .catch((error) => {
      console.error("获取弹窗信息失败:", error);
    });
});

额外注意事项 #

• 确保你的WMS服务开启了GetFeatureInfo支持，否则无法获取要素属性信息。
• 如果服务返回的是HTML格式的响应，你可以直接把响应内容作为InfoTemplate的content，无需解析JSON。
• 如果你需要给WMS中的多个子图层设置不同的弹窗模板，可以在点击时判断目标图层，切换对应的InfoTemplate即可。

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