Flutter：如何使用新的Marker API将标记添加到Google Maps？

Question

    mapController.addMarker(
  MarkerOptions(
    position: LatLng(37.4219999, -122.0862462),
  ),
);

我已经在博客文章中看到了此代码段，并且正在尝试向Google Maps添加标记。

未为类“ GoogleMapController”定义方法“ addMarker”。

我认为库已更改，我想知道执行此操作的新方法是什么，我在controller.dart和api参考中进行了查询，但无法弄清楚。

我很乐意看到有关它的一些教程和博客文章，不要犹豫分享。

Answer 1

是的，google maps API已更改，并且Marker API是基于小部件的，不再基于控制器。

由CHANGELOG.md

“发生了巨大的变化。将Marker API更改为基于小部件，它是基于控制器的。还更改了示例应用程序以解决该问题。”

我从github应用示例中复制了一些我认为对您很重要的代码

Map<MarkerId, Marker> markers = <MarkerId, Marker>{}; // CLASS MEMBER, MAP OF MARKS

void _add() {
    var markerIdVal = MyWayToGenerateId();
    final MarkerId markerId = MarkerId(markerIdVal);

    // creating a new MARKER
    final Marker marker = Marker(
      markerId: markerId,
      position: LatLng(
        center.latitude + sin(_markerIdCounter * pi / 6.0) / 20.0,
        center.longitude + cos(_markerIdCounter * pi / 6.0) / 20.0,
      ),
      infoWindow: InfoWindow(title: markerIdVal, snippet: '*'),
      onTap: () {
        _onMarkerTapped(markerId);
      },
    );

    setState(() {
      // adding a new marker to map
      markers[markerId] = marker;
    });
}

GoogleMap(
              onMapCreated: _onMapCreated,
              initialCameraPosition: const CameraPosition(
                target: LatLng(-33.852, 151.211),
                zoom: 11.0,
              ),
              // TODO(iskakaushik): Remove this when collection literals makes it to stable.
              // https://github.com/flutter/flutter/issues/28312
              // ignore: prefer_collection_literals
              markers: Set<Marker>.of(markers.values), // YOUR MARKS IN MAP
)

我建议您在这里查看示例应用程序。有更新到新的API。

Answer 2

我从谷歌代码实验室做了下面的例子。

Map<MarkerId, Marker> markers = <MarkerId, Marker>{};
LatLng _center =  LatLng(9.669111, 80.014007);

onMap 创建添加单个静态标记

void _onMapCreated(GoogleMapController controller) {
    mapController = controller;

    final marker = Marker(
      markerId: MarkerId('place_name'),
      position: LatLng(9.669111, 80.014007),
      // icon: BitmapDescriptor.,
      infoWindow: InfoWindow(
        title: 'title',
        snippet: 'address',
      ),
    );

    setState(() {
      markers[MarkerId('place_name')] = marker;
    });
  }

谷歌地图小部件：

GoogleMap(
                onMapCreated: _onMapCreated,
                initialCameraPosition: CameraPosition(
                  target: _center,
                  zoom: 14.0,
                ),
                markers: markers.values.toSet(),
              ),