从geoJSON获取地图视口中的要素

Question

我需要在地图上为我拥有的数据添加标记。

[在思考过程中，我经历了map.data.loadGeoJson('google.json');，可以将自定义数据附加到地图上。现在，我需要显示地图视口中存在的要素的属性。我无法遍历所有项目并检查.contains()，我有大量数据。是否有默认的google方式来获取地图视口中当前要素的属性？

Answer 1

我喜欢将TurfJS用于此类任务。我已经用1M点测试了它，并且它的工作速度比预期的要快。

---

伪代码

1. 一次加载您的GeoJSON并将其初始化为草皮要素集合
2. 将地图视口的边界转换为GeoJSON多边形
3. 运行pointsWithinPolygon功能
4. 使用addGeoJson将结果要素集传递到地图数据层上>
5. 在addGeoJson throttled事件中重复并重复

---

实际代码

bounds_changed
注意：由于直到您调用/*
 You'd load your own geojson like so:
 const points = turf.featureCollection(geojsonObject.features)
*/

// random 1M points as a demo
const points = turf.randomPoint(1e6, {
    bbox: [-180, -90, 180, 90]
});

const {
    west,
    south,
    east,
    north
} = map.getBounds().toJSON();

// extent in minX, minY, maxX, maxY order
const viewport_as_polygon = turf.bboxPolygon([west, south, east, north])


const points_within = turf.pointsWithinPolygon(points, viewport_as_polygon)
，这些都不会与DOM交互，因此它比为每个要素生成标记然后隐藏/修改视口之外的透明度的速度要快。