如何从我的多边形返回/获取坐标？

问题描述

我正在使用google-maps-react在地图上绘制多边形。

当我单击一个多边形时，我希望它返回该选定多边形的所有坐标。你能告诉我这是否可能吗？

这是我放入codesandBox中的代码：https://codesandbox.io/s/falling-tree-ikvq1?file=/src/index.js

这是我绘制地图的地方：

<Map
  google={this.props.google}
  className={"map"}
  zoom={4}
  initialCenter={{ lat: 20.0,lng: -70.0 }}
>
  <polygon
    onClick={this.handleClick}
    paths={triangleCoords}
    strokeOpacity={0.8}
    strokeWeight={2}
    fillColor={this.fillColors[0]}
    fillOpacity={0.35}
  />
</Map>

谢谢。

解决方法

您正在寻找的是Polygon类https://developers.google.com/maps/documentation/javascript/reference/polygon中的getPath方法

在您的沙箱中，我可以将路径作为对象获得，其中的数组长度为4：

handleClick = (props,polygon,e) => {
  console.log("polygon: ",polygon.getPath());
  const currentColor =
  polygon.fillColor == this.fillColors[0]
    ? this.fillColors[1]
    : this.fillColors[0];
   polygon.setOptions({ fillColor: currentColor });

};