Блог

У меня есть данные, в которых у меня есть значения 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 маркер, но не знаю, как добавить второй маркер сейчас.

Итак, я попробовал с вашим кодом и добавил некоторые изменения в ваш код, теперь он запущен. Итак, сначала я создал пустое list поле для хранения ваших данных маркеров. После этого создал 2 идентификатора маркера и добавил этот идентификатор в a list , а затем создал 2 markers с разными местоположениями идентификатор маркеров wrt и добавил этот маркер setmarkers , а затем просто получил доступ к значению этого на карте Google. для рисования маршрута на карте Google вы можете проверить статью 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
      ),
    );
  }
}