'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
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|