Googleマップの描画マネージャーポリゴンからGeoJSONを取得する

Question

私はユーザーがオーバーレイポリゴンを描画してGoogle Mapsコンポーネントを使ってプロットを定義できるReactアプリケーションを構築しています。ユーザーがポリゴンを描画するたびにGeoJSONをプッシュしたいと思います。

この時点では、ドキュメントは曖昧です。

[{"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が生成されますがあります。この種のものを生成する...

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

：私は、関数のこの種を使用していますか？

私はいつも.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のポリゴンオブジェクトを持っています。 Voila！

Answer 2

Wicketなどの変換ライブラリを使用すると、Googleのオーバーレイオブジェクトとgeojsonの有効なリテラルを変換することができます。 （免責事項：私は私自身のユースケースに合わせて、過去にウィケットにいくつかの貢献をしてきました）

私が開いていることを確認してください例に基づいてSimple Polygons

var triangleCoords = [ 
    {lat: 25.774, lng: -80.190}, 
    {lat: 18.466, lng: -66.118}, 
    {lat: 32.321, lng: -64.757}, 
    {lat: 25.774, lng: -80.190} 
]; 


var bermudaTriangle = new google.maps.Polygon({ 
    paths: triangleCoords, 
    strokeColor: '#FF0000', 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: '#FF0000', 
    fillOpacity: 0.35 
}); 

bermudaTriangle.setMap(map); 

var wicket=new Wkt.Wkt(), 
    wktpolygon= wicket.fromObject(bermudaTriangle); 

console.log(wktpolygon.toJson()); 

これを示すfiddleを作りました変換されたポリゴンを表示するコンソール