Flutter:如何使用新的 Marker API 向 Google 地图添加标记? [英] Flutter: How to add marker to Google Maps with new Marker API?

问题描述

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

我在博客文章中看到了这个代码片段，我正在尝试向 Google 地图添加标记.

I've seen this code snippet in a blog post, and I'm trying to add markers to Google Maps.

未为类GoogleMapController"定义方法addMarker".

The method 'addMarker' isn't defined for the class 'GoogleMapController'.

我认为图书馆已经改变，我想知道这样做的新方法是什么，我在controller.dart 和 api 参考 但无法弄清楚.

I think the library has changed and I want to know what's the new way doing this, I've looked up in the controller.dart and api reference but couldn't figure it out.

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

I would be happy to see some tutorials and blog posts about it, don't hesitate to share.

推荐答案

是的，谷歌地图 API 发生了变化，标记 API 是基于小部件的，不再基于控制器.

Yes, The google maps API has changed and the Marker API is widget based and not based in controller anymore.

来自 CHANGELOG.md

重大变化.将 Marker API 更改为基于小部件，它基于控制器.还更改了示例应用以考虑相同的情况."

我从 github 应用示例 我认为对你很重要

I copy some pieces of code from github app example that I think is important to you

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.

I advise you take a look in example app here. There is updated to new API.

这篇关于Flutter:如何使用新的 Marker API 向 Google 地图添加标记?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！