如何查找Mapbox图层中与目标多边形相交或包含的所有对象？

Mapbox GL JS没有内置的精确空间查询API，要实现你要的多边形相交/包含筛选，得结合Turf.js（开源地理空间分析库）来做，具体步骤如下：

1. 引入Turf.js #

可以通过npm安装：

npm install @turf/turf

或者下载本地文件引入到项目中，避免外链依赖。

2. 获取图层要素 #

先把目标Mapbox图层的所有要素取出来：

• 如果是本地GeoJSON数据源，直接从数据源获取：

const source = map.getSource('map-layer-source');
const sourceFeatures = source._data.features;

• 如果是矢量瓦片数据源，用querySourceFeatures获取：

const sourceFeatures = map.querySourceFeatures('map-layer-source', {
  sourceLayer: '你的矢量瓦片源图层名'
});

3. 精确空间筛选 #

遍历要素，用Turf的空间判断函数筛选出符合条件的要素：

// 你的目标多边形GeoJSON
const targetPolygon = {
  "type": "Polygon",
  "coordinates": [[/* 填入你的坐标数组 */]]
};

// 筛选与目标多边形相交或被包含的要素
const overlappingFeatures = sourceFeatures.filter(feature => {
  // 只处理多边形/多多边形类型的要素
  if (!['Polygon', 'MultiPolygon'].includes(feature.geometry.type)) return false;
  
  // 判断两种情况：目标包含当前要素，或者两者相交
  const isContained = turf.booleanContains(targetPolygon, feature.geometry);
  const isIntersected = turf.booleanIntersects(targetPolygon, feature.geometry);
  
  return isContained || isIntersected;
});

// 输出结果
overlappingFeatures.forEach(obj => {
  console.log("Name: ", obj.properties.name);
});

4. 性能优化建议 #

如果图层要素很多，直接遍历全部要素会慢，可以先通过边界矩形做初步过滤，再做精确判断：

// 先获取目标多边形的边界矩形，用它筛选出范围内的要素
const bbox = turf.bbox(targetPolygon);
const initialFiltered = map.queryRenderedFeatures({
  layers: ['MapLayer'],
  bbox: bbox
});

// 再在初步结果中做精确空间判断
const overlappingFeatures = initialFiltered.filter(feature => {
  const isContained = turf.booleanContains(targetPolygon, feature.geometry);
  const isIntersected = turf.booleanIntersects(targetPolygon, feature.geometry);
  return isContained || isIntersected;
});

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