'Is there a way on Flutter to identify and navigate to a marker from my current Location?

I have a group of markers which I retrieved and plotted on a google maps interface. I have also implement a geolocator package that gets users location.

So I have a current Position and a set of markers to search from.

below is the code to my interface

import 'dart:async';
import 'package:provider/provider.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart'; //not supported by webs only android and ios
import 'package:survey_pillars/screens/controlLIstView.dart';
import 'bloc_management/application_bloc.dart';


Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context)=> ApplicationBloc(),
      child: MaterialApp(
        debugShowCheckedModeBanner: false,
        home: MapBody(),
      ),
    );
  }
}

class MapBody extends StatefulWidget {
  @override
  _MapBodyState createState() => _MapBodyState();
}

class _MapBodyState extends State<MapBody> {
  Completer<GoogleMapController> _mapController = Completer(); //google map


  // controller

  static final CameraPosition currentPosition = CameraPosition(
    target: LatLng(6.62889, -1.58311),
    zoom: 12,
  );



  Future<void> _moveMap() async {
    CameraPosition _new_points = CameraPosition(
        bearing: 192.8334901395799,
        target: LatLng(5.6654, -1.068396),
        tilt: 59.440717697143555,
        zoom: 8.151926040649414);

    final GoogleMapController controller = await _mapController.future;
    controller.animateCamera(CameraUpdate.newCameraPosition(_new_points));
  }

  Future<void> _getMyLoc() async {
//    final GoogleMapController controller = await _mapController.future;
//    controller.animateCamera(CameraUpdate.newCameraPosition(newPosition));
  }

  final Stream<QuerySnapshot> controlsStream =
      FirebaseFirestore.instance.collection('controls').snapshots();
  var allControls = [];
  var filteredControls = [];
  final Set<Marker>  allControlMarkers = {};

  Future<QuerySnapshot?> getControls() async {
    FirebaseFirestore.instance
        .collection('controls')
        .get()
        .then((QuerySnapshot querySnapshot) {
      querySnapshot.docs.forEach((doc) {
        allControls.add(doc.data());
        filteredControls.add(doc.data());

        setState(() {
          allControlMarkers.add(Marker(
              markerId: MarkerId(doc['name']),
              infoWindow: InfoWindow(
                title: doc['name'],
//                snippet: ,
              ),
              icon: BitmapDescriptor.defaultMarker,
              draggable: false,
              position: LatLng(doc["LatLong"][0], doc["LatLong"][1]),
              onTap: () {
                
              }));
        });
      });
    });

    return null;
  }

  @override
  void initState() {
    // TODO: implement initState
    getControls();

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
//    provider integration to map
    final applicationBloc = Provider.of<ApplicationBloc>(context);

    print(allControlMarkers);

    return Scaffold(
      appBar: AppBar(
        title: Text("All Points"),
        centerTitle: false,
        toolbarHeight: 35,
        elevation: 15,
        primary: true,
        backgroundColor: Colors.deepOrange,
      ),
      body: (applicationBloc.currentLocation == null ) ?
      Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Center(child: CircularProgressIndicator()),

          Center(child: Text("Loading Map..."),)

        ],
      )

      :GoogleMap(
        markers: allControlMarkers,
        compassEnabled: true,
//        liteModeEnabled: true,
        zoomGesturesEnabled: true,
//        indoorViewEnabled: true,
        buildingsEnabled: true,
        myLocationEnabled: true,
        myLocationButtonEnabled: true,
        trafficEnabled: true,
        mapType: MapType.normal,

        initialCameraPosition: applicationBloc.currentLocation == null? currentPosition: CameraPosition(
          target: LatLng(applicationBloc.currentLocation!.latitude,
              applicationBloc.currentLocation!.longitude),
          zoom: 6,
        ),
        zoomControlsEnabled: true,
        onMapCreated: (GoogleMapController controller) {
          _mapController.complete(controller);
        },
      ),

    );
  }
}

**

Right now, What I want is a way to identify the closest marker to the user and navigate to it using the map. Any ideas / leads or help will be helpful. Thanks in advance!

**

Below is a picture of my interface

Picture of my app's interface



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source