在 Google 地图上以 flutter 显示多个标记

Question

我能够在 google 地图中显示单个标记，但是当我尝试添加标记列表时，只有第一个标记显示在颤动中。请指导我如何在 google 地图中添加标记列表。这是我的代码。

class MapsScreen extends StatefulWidget {
  static const routeName = '/maps-screen';

  @override
  _MapsScreenState createState() => _MapsScreenState();
}

class _MapsScreenState extends State<MapsScreen> {
  Completer<GoogleMapController> _controller = Completer();
  Set<Marker> _markers = {};
  Marker marker1 = Marker(
    markerId: MarkerId('Marker1'),
    position: LatLng(32.195476, 74.2023563),
    infoWindow: InfoWindow(title: 'Business 1'),
    icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueRed),
  );
  Marker marker2 = Marker(
    markerId: MarkerId('Marker2'),
    position: LatLng(31.110484, 72.384598),
    infoWindow: InfoWindow(title: 'Business 2'),
    icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueBlue),
  );
  List<Marker> list = [];
  @override
  void initState() {
    list = [marker1, marker2];
    // _markers.addAll(list);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('Maps'),
      ),
      body: GoogleMap(
        markers: Set<Marker>.of(list),
        onMapCreated: (GoogleMapController controller) {
          _controller.complete(controller);
        },
        initialCameraPosition: CameraPosition(
          target: LatLng(32.1749132, 74.1779387),
          zoom: 11.0,
        ),
      ),
    );
  }
}

Answer 1

你可以这样做

List<Marker> list = [
 Marker(
    markerId: MarkerId('Marker1'),
    position: LatLng(32.195476, 74.2023563),
    infoWindow: InfoWindow(title: 'Business 1'),
    icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueRed),
  );
   Marker(
    markerId: MarkerId('Marker2'),
    position: LatLng(31.110484, 72.384598),
    infoWindow: InfoWindow(title: 'Business 2'),
    icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueBlue),
  );
 ];

并在列表中添加数据时使用 setState

       setState(() {
           markers.addAll(list);
          });

在 Google 地图上以 flutter 显示多个标记

Display multiple markers on Google maps in flutter

google-maps

google-maps-markers

dart

flutter