Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/iconica-development/flutter_google_track_and_trace
Google Maps widget for use in Beep
https://github.com/iconica-development/flutter_google_track_and_trace
component
Last synced: 2 days ago
JSON representation
Google Maps widget for use in Beep
- Host: GitHub
- URL: https://github.com/iconica-development/flutter_google_track_and_trace
- Owner: Iconica-Development
- License: other
- Created: 2023-01-24T09:07:17.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2025-01-08T09:08:27.000Z (22 days ago)
- Last Synced: 2025-01-08T10:23:50.672Z (22 days ago)
- Topics: component
- Language: Dart
- Size: 424 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Track and Trace with Google Maps For Flutter
A Flutter packages that provides a wrapper around a [Google Maps](https://developers.google.com/maps/) widget.
## Features
* Show a Google Map with 2 markers on it
* Calculate a Route between the two markers
* Update the route and route information with a set time interval
* Retrieve the travel distance and time
* Use custom styling for the map, markers and line
* Automatically center the view between the two markers
* Make all Google Maps settings available through the GoogleTrackTraceMap## Getting started
Because this package uses Google Maps for the Map and the route calculation you need to follow the Flutter Google Maps guide:
* Get an API key at .
* Enable Google Map SDK for each platform.
* Go to [Google Developers Console](https://console.cloud.google.com/).
* Choose the project that you want to enable Google Maps on.
* Select the navigation menu and then select "Google Maps".
* Select "APIs" under the Google Maps menu.
* To enable Google Maps for Android, select "Maps SDK for Android" in the "Additional APIs" section, then select "ENABLE".
* To enable Google Maps for iOS, select "Maps SDK for iOS" in the "Additional APIs" section, then select "ENABLE".
* Make sure the APIs you enabled are under the "Enabled APIs" section.For more details, see [Getting started with Google Maps Platform](https://developers.google.com/maps/gmp-get-started).
### Android
1. Set the `minSdkVersion` in `android/app/build.gradle`:
```groovy
android {
defaultConfig {
minSdkVersion 20
}
}
```This means that app will only be available for users that run Android SDK 20 or higher.
2. Specify your API key in the application manifest `android/app/src/main/AndroidManifest.xml`:
```xml
```
### iOS
This plugin requires iOS 9.0 or higher. To set up, specify your API key in the application delegate `ios/Runner/AppDelegate.m`:
```objectivec
#include "AppDelegate.h"
#include "GeneratedPluginRegistrant.h"
#import "GoogleMaps/GoogleMaps.h"@implementation AppDelegate
- (BOOL)application:(UIApplication *)application
didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
[GMSServices provideAPIKey:@"YOUR KEY HERE"];
[GeneratedPluginRegistrant registerWithRegistry:self];
return [super application:application didFinishLaunchingWithOptions:launchOptions];
}
@end
```Or in your swift code, specify your API key in the application delegate `ios/Runner/AppDelegate.swift`:
```swift
import UIKit
import Flutter
import GoogleMaps@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
override func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
GMSServices.provideAPIKey("YOUR KEY HERE")
GeneratedPluginRegistrant.register(with: self)
return super.application(application, didFinishLaunchingWithOptions: launchOptions)
}
}
```### WEB
Add the following code in the 'head' of 'web/index.html':```html
```
## Usage
```dart
class TrackTraceDemo extends StatefulWidget {
const TrackTraceDemo({Key? key}) : super(key: key);@override
State createState() => _TrackTraceDemoState();
}class _TrackTraceDemoState extends State {
TrackTraceController? controller;@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: (controller == null || controller!.route == null)
? const Text('TrackTrace example')
: Text(controller!.route!.duration.toString() +
' seconds, distance: ' +
(controller!.route!.distance / 1000).toString() +
' km')),
body: GoogleTrackTraceMap(
startPosition: const Marker(
markerId: MarkerId('Start location'),
position: LatLng(52.356057, 4.897540),
),
destinationPosition: const Marker(
markerId: MarkerId('Destination location'),
position: LatLng(52.364709, 4.877157)),
googleAPIKey: '', // put your own API key here
travelMode: TravelMode.bicycling,
routeUpdateInterval: 60,
timerPrecision: TimePrecision.everySecond,
zoomGesturesEnabled: true,
line: const Polyline(
polylineId: PolylineId('test route'),
color: Colors.purple,
width: 7,
),
onMapCreated: (ctr) => {
controller = ctr,
ctr.addListener(() {
setState(() {});
}),
},
),
);
}
}
```See the `example` directory for a complete sample app.