嗨，我来帮你搞定这个需求！你已经完成了最关键的部分——关联地图要素和表格行，并且能定位弹窗位置，现在只需要把要素图层的popupTemplate内容正确填充进去就行，我给你分两种实用方案：

方案一：直接复用表格行存储的要素对象（效率更高） #

如果在初始化表格的时候，你能把每个要素对应的Graphic对象直接存在表格数据源里，那点击表格行时就能直接拿过来用，不用额外发请求：

1. 初始化表格时存储Graphic

   // 假设你从要素图层获取数据生成表格
   const featureLayer = this.mapView.map.findLayerById('your-target-layer-id') as FeatureLayer;
   
   featureLayer.queryFeatures({
     outFields: ['*'], // 返回所有属性字段，确保popupTemplate用到的字段都包含
     returnGeometry: true
   }).then(results => {
     // 把要素属性和Graphic对象一起存入表格数据源
     this.tableRows = results.features.map(graphic => ({
       displayName: graphic.attributes.NAME,
       objectId: graphic.attributes.OBJECTID,
       // 核心：存下完整的Graphic对象
       graphic: graphic
     }));
   });
   

2. 点击表格行触发弹窗

   onTableRowClick(selectedRow) {
     const targetGraphic = selectedRow.graphic;
     // 设置弹窗位置（用要素几何中心或者你之前的经纬度都可以）
     this.mapView.popup.location = targetGraphic.geometry.centroid;
     // 绑定要素后，popup会自动使用图层的popupTemplate渲染内容
     this.mapView.popup.features = [targetGraphic];
     // 打开弹窗
     this.mapView.popup.open();
   }
   

方案二：通过要素ID查询后渲染（适合无法提前存储Graphic的场景） #

如果表格里只存了要素的唯一标识（比如OBJECTID），可以通过要素图层的查询方法获取对应Graphic再渲染：

onTableRowClick(selectedRow) {
  const objectId = selectedRow.objectId;
  const featureLayer = this.mapView.map.findLayerById('your-target-layer-id') as FeatureLayer;

  // 查询对应要素
  featureLayer.queryFeatures({
    where: `OBJECTID = ${objectId}`,
    outFields: ['*'],
    returnGeometry: true
  }).then(results => {
    if (results.features.length > 0) {
      const targetGraphic = results.features[0];
      // 同上，设置弹窗位置和绑定要素
      this.mapView.popup.location = targetGraphic.geometry.centroid;
      this.mapView.popup.features = [targetGraphic];
      this.mapView.popup.open();
    }
  });
}

关键注意事项 #

• 确保你的要素图层已经正确配置了popupTemplate，否则popup还是无法生成内容
• 查询要素时，outFields必须包含popupTemplate里用到的所有字段，不然会出现属性缺失
• 如果用自定义经纬度定位，要确认坐标的空间参考和地图一致（比如常用的WGS84或Web Mercator）

内容的提问来源于stack exchange，提问作者P. Lynch