如何在谷歌地图上添加多边形？答案

【问题标题】：How to add a polygon on google maps?如何在谷歌地图上添加多边形？
【发布时间】：2019-11-12 21:57:38
【问题描述】：

我正在使用 google_maps_flutter 插件来使用谷歌地图。我想在谷歌地图上绘制一个多边形，坐标取自用户。所采用的坐标是“位置”对象的类型。

我已经尝试过使用 map_view 插件来绘制多边形。但这对我不起作用。

这是获取坐标的代码 sn-p。

Geolocator geolocator = Geolocator();
StreamSubscription<Position> _positionStreamSubscription;
final List<Position> _positions = <Position>[];

void _toggleListening() {
if (_positionStreamSubscription == null) {
  const LocationOptions locationOptions =
      LocationOptions(accuracy: LocationAccuracy.best, distanceFilter: 10);
  final Stream<Position> positionStream =
      Geolocator().getPositionStream(locationOptions);
  _positionStreamSubscription = positionStream.listen(
      (Position position) => setState(() => _positions.add(position)));
  _positionStreamSubscription.pause();
}

setState(() {
  if (_positionStreamSubscription.isPaused) {
    _positionStreamSubscription.resume();
  } else {
    _positionStreamSubscription.pause();
  }
});

【问题讨论】：

标签： android google-maps flutter dart

【解决方案1】：

好吧，如果您可以将Position 对象的坐标转换为LatLng 对象，那么您可以使用google_maps_flutter 本身来绘制多边形。你可以看到one of its parameters 允许Polygons。因此，在 google_maps_flutter 示例的基础上，我们将首先设置我们的多边形：

Set<Polygon> myPolygon() {
  List<LatLng> polygonCoords = new List();
  polygonCoords.add(LatLng(37.43296265331129, -122.08832357078792));
  polygonCoords.add(LatLng(37.43006265331129, -122.08832357078792));
  polygonCoords.add(LatLng(37.43006265331129, -122.08332357078792));
  polygonCoords.add(LatLng(37.43296265331129, -122.08832357078792));

  Set<Polygon> polygonSet = new Set();
  polygonSet.add(Polygon(
      polygonId: PolygonId('test'),
      points: polygonCoords,
      strokeColor: Colors.red));

  return polygonSet;
}

然后将其提供给 GoogleMap 小部件。

GoogleMap(
  polygons: myPolygon(),
  mapType: MapType.normal,
  initialCameraPosition: _kGooglePlex,
  onMapCreated: (GoogleMapController controller) {
    _controller.complete(controller);
  },
),

这将在 GooglePlex 附近绘制一个小三角形。

有关此功能的更多信息，您可以参考Maps SDK Shapes 的Android 文档。 API 用法应该相同（如果不相似），因此您可以将其用作指南。

【讨论】：