Add distance to map lat lang

android/app/src/main/AndroidManifest.xml

@@ -49,6 +49,6 @@
             android:name="flutterEmbedding"
             android:value="2" />
        <meta-data android:name="com.google.android.geo.API_KEY"
-           android:value="AIzaSyBOigf-qg4v_aD0Jrx2wFOMNzObxXrfDEM"/>
+           android:value="AIzaSyDJpK9RVhlBejtJu9xSGfneuTN6HOfJgSM"/>
     </application>
 </manifest>

lib/location_controller.dart

@@ -18,7 +18,7 @@ class LocationController<T> extends GetxController {
   /*final Rx<LatLng?> locationPosition =
       const LatLng(12.90618717, 77.5844983).obs;*/
   final Rx<LatLng?> locationPosition =
-      const LatLng(17.491659, 78.391983).obs;
+      const LatLng(0, 0).obs;
 
   bool locationServiceActive = true;
 

lib/order_tracking_page.dart

@@ -1,10 +1,13 @@
 import 'dart:async';
 import 'dart:developer';
+import 'dart:math';
+
 
 import 'package:flutter/material.dart';
 import 'package:flutter_polyline_points/flutter_polyline_points.dart';
 import 'package:get/get.dart';
 import 'package:google_maps_flutter/google_maps_flutter.dart';
+import 'package:location/location.dart';
 
 import 'location_controller.dart';
 
@@ -26,22 +29,16 @@ class OrderTrackingPageState extends State<OrderTrackingPage> {
   PolylinePoints polylinePoints = PolylinePoints();
   double latitude=0;
   double longitude=0;
+  LocationData? currentLocation;
 
-  String googleAPiKey ="AIzaSyBOigf-qg4v_aD0Jrx2wFOMNzObxXrfDEM";
+  String googleAPiKey ="AIzaSyDJpK9RVhlBejtJu9xSGfneuTN6HOfJgSM";
 
   Set<Marker> markers = {};
   Map<PolylineId, Polyline> polylines = {};
 
   LatLng startLocation = const LatLng(17.416806,78.4521704);
-
-
   LocationController locationController = Get.put(LocationController());
-
-
-
-
-
-
+  double distance = 0.0;
 
   @override
   void initState() {
@@ -52,7 +49,7 @@ class OrderTrackingPageState extends State<OrderTrackingPage> {
 
     ever<LatLng?>(locationController.locationPosition, (value) {
       if (value != null) {
-        log("${value.latitude} ${value.longitude}");
+       // log("${value.latitude} ${value.longitude}");
         var latitude = value.latitude;
         var longitude = value.longitude;
         startLocation = LatLng(latitude, longitude);
@@ -61,6 +58,7 @@ class OrderTrackingPageState extends State<OrderTrackingPage> {
     });
 
     getDirections(endLocation); //fetch direction polylines from Google API
+
   }
 
   getDirections(endLocation) async {
@@ -100,8 +98,24 @@ class OrderTrackingPageState extends State<OrderTrackingPage> {
         polylineCoordinates.add(LatLng(point.latitude, point.longitude));
       }
     } else {
-      log(result.errorMessage ?? "Something went wrong");
+     // log(result.errorMessage ?? "Something went wrong");
     }
+
+//polulineCoordinates is the List of longitute and latidtude.
+    double totalDistance = 0;
+    for(var i = 0; i < polylineCoordinates.length-1; i++){
+      totalDistance += calculateDistance(
+          polylineCoordinates[i].latitude,
+          polylineCoordinates[i].longitude,
+          polylineCoordinates[i+1].latitude,
+          polylineCoordinates[i+1].longitude);
+    }
+    print(totalDistance);
+
+    setState(() {
+      distance = totalDistance;
+    });
+
     addPolyLine(polylineCoordinates);
   }
 
@@ -109,9 +123,9 @@ class OrderTrackingPageState extends State<OrderTrackingPage> {
     PolylineId id = const PolylineId("poly");
     Polyline polyline = Polyline(
       polylineId: id,
-      color: Colors.red,
+      color: Colors.deepPurpleAccent,
       points: polylineCoordinates,
-      width: 4,
+      width: 8,
     );
     polylines[id] = polyline;
 
@@ -125,31 +139,69 @@ class OrderTrackingPageState extends State<OrderTrackingPage> {
     setState(() {});
   }
 
+
+  double calculateDistance(lat1, lon1, lat2, lon2){
+    var p = 0.017453292519943295;
+    var a = 0.5 - cos((lat2 - lat1) * p)/2 +
+        cos(lat1 * p) * cos(lat2 * p) *
+            (1 - cos((lon2 - lon1) * p))/2;
+    return 12742 * asin(sqrt(a));
+  }
+
+
+
+
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      body: GoogleMap(
-        //Map widget from google_maps_flutter package
-        zoomGesturesEnabled: true,
-        //enable Zoom in, out on map
-        initialCameraPosition: CameraPosition(
-          //innital position in map
-          target: startLocation, //initial position
-          zoom: 8.0, //initial zoom level
-        ),
-        markers: markers,
-        //markers to show on map
-        polylines: Set<Polyline>.of(polylines.values),
-        //polylines
-        mapType: MapType.normal,
-        //map type
-        onMapCreated: (controller) {
-          //method called when map is created
-          if (!mapController.isCompleted) {
-            mapController.complete(controller);
-          }
-        },
-      ),
+      body: Stack(
+        children: [
+          GoogleMap(
+            //Map widget from google_maps_flutter package
+            zoomGesturesEnabled: true,
+            //enable Zoom in, out on map
+            initialCameraPosition: CameraPosition(
+              //innital position in map
+              target: startLocation, //initial position
+              zoom: 8.0, //initial zoom level
+            ),
+
+            markers: markers,
+            //markers to show on map
+            polylines: Set<Polyline>.of(polylines.values),
+            //polylines
+            mapType: MapType.normal,
+            //map type
+            onMapCreated: (controller) {
+              //method called when map is created
+              if (!mapController.isCompleted) {
+                mapController.complete(controller);
+              }
+            },
+
+          ),
+
+          const SizedBox(
+            height: 95,
+          ),
+
+          Positioned(
+              bottom: 100,
+              left: 50,
+              child: Container(
+                  child: Card(
+                    child: Container(
+                        padding: EdgeInsets.all(20),
+                        child: Text("Total Distance: " + distance.toStringAsFixed(2) + " KM",
+                            style: TextStyle(fontSize: 20, fontWeight:FontWeight.bold))
+                    ),
+                  )
+              )),
+        ],
+      )
+
+
     );
+
   }
 }