颤振如何在同一张地图中添加2个标记

Question

我有数据，其中我有起点和终点的 lat 和 long 值。

我正在尝试显示这样的标记

class _TripRouteScreenState extends State<TripRouteScreen> {
  BitmapDescriptor pinLocationIcon;

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

  void setCustomMapPin() async {
    pinLocationIcon = await BitmapDescriptor.fromAssetImage(
        ImageConfiguration(devicePixelRatio: 2.5), 'images/pin.png');
  }

  @override
  void initState() {
    super.initState();
    setCustomMapPin();
    working();

  }

  working(){
    print(widget.data);

    double start_latitude = widget.data['start']['lat'].toDouble();
    double start_longitude = widget.data['start']['lon'].toDouble();

    double end_latitude = widget.data['end']['lat'].toDouble();
    double end_longitude = widget.data['end']['lon'].toDouble();

    start_currentPostion = LatLng(start_latitude, start_longitude); //this is the marker 1 location  which is already set and showing in map
    end_currentPostion = LatLng(end_latitude, end_longitude); // this is the marker 2 location which needs to be set and show marker on this value 

    print(start_currentPostion);
    print(end_currentPostion);
    var snip = widget.data["start"]["address"];
    final Map<String, Marker> _markers = {};

    setState(() {
      final MarkerId markerId = MarkerId('1');

      // creating a new MARKER
      final Marker marker = Marker(
        markerId: markerId,
        icon: pinLocationIcon,
        position: start_currentPostion,
        infoWindow: InfoWindow(title: 'Address',snippet: snip),
      );

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          leading: GestureDetector(
              onTap: () {
                Navigator.pop(context);
              },
              child: Icon(Icons.arrow_back)),
          centerTitle: true,
          flexibleSpace: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage('images/nav.jpg'),
                fit: BoxFit.cover,
              ),
            ),
          ),
          backgroundColor: Colors.transparent,
          title: Text(
            'Route Location',
            style: TextStyle(fontFamily: 'UbuntuBold'),
          ),
          actions: [
            Padding(
              padding: const EdgeInsets.only(right: 15),
              child: Icon(
                Icons.notifications_none,
                size: 33,
              ),
            )
          ]),
      body: GoogleMap(
        mapType: MapType.normal,
        initialCameraPosition: CameraPosition(
          target: start_currentPostion,
          zoom: 15,
        ),
        markers: Set<Marker>.of(markers.values), // YOUR MARKS IN MAP
      ),
    );
  }
}

问题是我可以在地图上添加一个标记，但只能在起点上：D 意思是 start_currentPostion 我需要在终点上添加一个标记，也就是 end_currentPostion 但我不知道该怎么做。最后，从教程和其他答案中，我可以添加 1 个标记，但现在不知道如何添加第二个标记。

Answer 1

所以我尝试了您的代码，并在您的代码中添加了一些更改，现在它正在运行。所以首先，我创建了一个空的list 来存储您的标记数据。之后创建 2 个标记 id 并将该 id 添加到 list 中，然后创建具有不同 位置 wrt 标记 id 的 2 markers 并将此标记添加到 setmarkers 和然后只需将 this 的值访问到谷歌地图中。 要在谷歌地图上绘制路线，您可以查看medium 文章和此Github 帖子

class _TripRouteScreenState extends State<HomeScreen> {
  BitmapDescriptor pinLocationIcon;

  var start_currentPostion;
  var end_currentPostion;

  Map<MarkerId, Marker> setmarkers = {};
  List listMarkerIds = List();  // For store data of your markers 

  @override
  void initState() {
    super.initState();
    working();
  }

  working() {

    // You just need to pass dynamically your data

    double start_latitude = 19.965651;
    double start_longitude = 73.771683;

    double end_latitude = 19.997454;
    double end_longitude = 73.789803;

    start_currentPostion = LatLng(start_latitude, start_longitude);
    end_currentPostion = LatLng(end_latitude, end_longitude);


    setState(() {
      MarkerId markerId1 = MarkerId("1");
      MarkerId markerId2 = MarkerId("2");

      listMarkerIds.add(markerId1);
      listMarkerIds.add(markerId2);

      Marker marker1 = Marker(
        markerId: markerId1,
        position: LatLng(start_latitude, start_longitude),
        icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueRed),
      );

      Marker marker2 = Marker(
        markerId: markerId2,
        position: LatLng(end_latitude, end_longitude),
        icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueRed),  // you can change the color of marker
      );

      setmarkers[markerId1] = marker1;  // I Just added here markers on the basis of marker id 
      setmarkers[markerId2] = marker2;

    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          leading: GestureDetector(
              onTap: () {
                Navigator.pop(context);
              },
              child: Icon(Icons.arrow_back)),
          centerTitle: true,
          flexibleSpace: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage('images/nav.jpg'),
                fit: BoxFit.cover,
              ),
            ),
          ),
          backgroundColor: Colors.transparent,
          title: Text(
            'Route Location',
            style: TextStyle(fontFamily: 'UbuntuBold'),
          ),
          actions: [
            Padding(
              padding: const EdgeInsets.only(right: 15),
              child: Icon(
                Icons.notifications_none,
                size: 33,
              ),
            )
          ]),
      body: GoogleMap(
        mapType: MapType.normal,
        initialCameraPosition: CameraPosition(
          target: start_currentPostion,
          zoom: 15,
        ),
        markers: Set.of(setmarkers.values), // YOUR MARKS IN MAP
      ),
    );
  }
}