javascript - 从 Google map 绘图管理器多边形获取 GeoJSON

Question

我正在构建一个 React 应用程序，它允许用户通过 Google map 组件通过绘制叠加多边形来定义绘图。每次用户绘制多边形时，我都想推送一个 GeoJSON。

文档在这一点上含糊不清。我正在使用这种功能:

onPolygonComplete={polygon => {
                console.log(JSON.stringify(polygon.getPaths().b[0].b));
            }}

...产生这种东西:

[{"lat":32.22020791674245,"lng":35.22491455078125},{"lat":31.98754909816049,"lng":35.20294189453125},{"lat":32.0201569982896,"lng":35.43365478515625},{"lat":32.22485504316297,"lng":35.30731201171875}]

一个好的开始 - 但是否有任何内置的东西可以生成实际的 GeoJSON？

我总是可以使用 .map 来遍历这个数组并从中提取一个 GeoJSON 对象......但想问问是否有人知道已经融入 API 中的东西。

Answer 1

好的，我知道了。

首先，声明一个 GeoJSON 模板变量:

let GeoJSON = {
    type: 'Feature',
    geometry: {
        type: 'Polygon',
        coordinates: []
    },
    properties: {}
};

然后，在您的绘图管理器中，执行以下操作:

onPolygonComplete={polygon => {
                for (let point of polygon.getPath().getArray()) {
                    GeoJSON.geometry.coordinates.push([point.lng(), point.lat()]);
                }

现在，您有了一个完美的 GeoJSON 多边形对象。瞧!