如何用ArcGIS JS实现输入坐标时通过Search组件选中对应多边形

这个需求完全可以通过ArcGIS JS API实现，核心思路是给Search组件添加自定义搜索源，当用户输入坐标时，通过空间查询找到包含该坐标的多边形，再将结果返回给Search组件实现选中效果。

1. 创建自定义坐标搜索源 #

首先定义一个自定义搜索源，负责解析输入的坐标并执行空间查询：

// 假设你的多边形图层实例是polygonLayer
const polygonLayer = yourPolygonLayer;

const coordinateSearchSource = new SearchSource({
  placeholder: "输入经纬度（如：116.397,39.908）",
  getResults: async (params) => {
    const input = params.searchTerm.trim();
    // 解析输入的经纬度（支持"经度,纬度"格式）
    const [lon, lat] = input.split(",").map(Number);
    if (isNaN(lon) || isNaN(lat)) return [];

    // 创建WGS84坐标系的点对象
    const point = new Point({
      longitude: lon,
      latitude: lat,
      spatialReference: { wkid: 4326 }
    });

    // 转换点到多边形图层的空间参考（如果图层不是WGS84）
    const transformedPoint = point.project(polygonLayer.spatialReference);

    // 构建空间查询：查找包含该点的多边形
    const query = polygonLayer.createQuery();
    query.geometry = transformedPoint;
    query.spatialRelationship = "contains"; // 匹配点在内部的多边形
    query.returnGeometry = true;
    query.outFields = ["*"]; // 返回所有属性，可按需调整

    // 执行查询并转换为Search组件需要的结果格式
    const featureResults = await polygonLayer.queryFeatures(query);
    return featureResults.features.map(feature => ({
      feature: feature,
      displayText: `多边形: ${feature.attributes.id}`, // 自定义结果显示文本
      extent: feature.geometry.extent
    }));
  }
});

2. 配置Search组件 #

将自定义搜索源添加到Search实例中，同时可以保留原有的属性搜索源：

const searchWidget = new Search({
  view: view, // 你的MapView/SceneView实例
  sources: [
    // 保留原有的属性搜索源（如果需要）
    {
      layer: polygonLayer,
      searchFields: ["name", "code"], // 你要搜索的属性字段
      displayField: "name",
      placeholder: "搜索多边形属性"
    },
    // 添加自定义坐标搜索源
    coordinateSearchSource
  ]
});

// 将Search组件添加到视图UI
view.ui.add(searchWidget, { position: "top-right" });

3. 优化选中高亮效果（可选） #

如果需要选中多边形后高亮显示，可以监听Search的select-result事件添加高亮：

searchWidget.on("select-result", (event) => {
  // 清除之前的高亮
  view.highlight.removeAll();
  // 高亮当前选中的多边形
  view.highlight(event.result.feature);
});

注意事项 #

• 坐标格式兼容：如果需要支持更多坐标格式（如度分秒、UTM坐标），可以扩展坐标解析逻辑
• 空间参考一致性：确保输入坐标的空间参考与图层匹配，必要时进行投影转换
• 查询性能优化：数据量大时，限制query.outFields只返回必要字段，或使用图层的空间索引加速查询

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