d3-geo:在多个几何图形中找到质心

Question

我使用react-simple-maps在美国地图上显示一些数据，我需要根据一些标准对状态进行分组。每一组都应该有自己的标记。我有每个州的地理位置，所以我需要在一个州中以某种方式合并每个州的坐标，找到质心。

我不知道该怎么做。目前，我只是在组中取每种状态的边界(d3-geo:geoBounds)，并通过从左上角到右下角的每个界取最小最大值来计算中心，然后找到这个大区域的中心。

let geosBounds = geos.filter(g => !excludeZones.includes(g.properties.code)).map(g => geoBounds(g))
if (geosBounds.length === 0 && geos.some(g => excludeZones.includes(g.properties.code)) && geos.length === 1) {
  return separateZoneCenters[geos[0].properties.code]
}
const totalArea = geosBounds.reduce((acc, [[x0, y0],[x1, y1]]) => ({
  x0: acc.hasOwnProperty('x0') ? Math.min(acc.x0, x0) : x0,
  x1: acc.hasOwnProperty('x1') ? Math.max(acc.x1, x1) : x1,
  y0: acc.hasOwnProperty('y0') ? Math.min(acc.y0, y0) : y0,
  y1: acc.hasOwnProperty('y1') ? Math.max(acc.y1, y1) : y1,
}), {})
return [
  (totalArea.x1 +  totalArea.x0)  / 2,
  (totalArea.y1 +  totalArea.y0) / 2
];

所以我最终得到了这样的东西：

结果示例

你能建议我如何将地理信息合并成一个整体，并找到一个合适的质心来在一个组中放置一个标记吗？

Answer 1

因此，我找到了一个使用topojson的解决方案：

const merged = topojson.merge(states, states.objects.states.geometries.filter(geo => group.states.includes(geo.properties.code)))
const centroid = geoCentroid(merged)
return {
  coordinates: centroid,
}

现在看上去怎么样

而且看起来不错！但也许还有其他的解决办法吗？