Google Maps in Flutter, How to Load Google Maps
Nowadays Google Maps is the most important part of everyone's life. Flutter provided a plugin to load google maps. Integrate this plugin in the Flutter application. Add Plugin to application dev_dependencies: To use Google Maps we need to get a Google API key. Create a new project GoTo Conolse and select application and go to API & Services and create credentials and copy the API key. Enable GoogleMaps SDK API Now come to the Flutter application and Paste your key in the Manifest file inside the meta tag. android:value=""/> Create Googlemaps widget Now create a Widget and add below code import 'dart:async'; import 'package:flutter/material.dart'; class MyMaps extends StatefulWidget{ } @override onTap: (_){ }, ), } Now run the flutter application. Now you can see Google Maps on your Screen Show Multiple Markers on Maps Flutter
Every technology wants to add GoogleMaps in the application.
Plugin google_maps_flutter
Create Application:
First, create a Flutter application in Any IDE, I am using Android Studio.
By creating a new Flutter Application menu in the File options.
First, we need to add google_maps_flutter dependency in the pubspec.yaml file under the dependency line. It should be like below. Replace the version with the latest available version.
flutter_test:
sdk: flutter
google_maps_flutter: ^0.5.21+11
For this, we need to create an application in Google Console and get an API key.
Google Console 
import 'package:google_maps_flutter/google_maps_flutter.dart';
@override
State createState() {
// TODO: implement createState
return MyMapsState();
}
class MyMapsState extends State{
Completer _controller = Completer();
static final CameraPosition _kGooglePlex = CameraPosition(
target: LatLng(17.385044, 78.486671),
zoom: 14.4746,
);
@override
void initState() {
// TODO: implement initState
super.initState();
}
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(leading: Icon(Icons.map),backgroundColor: Colors.grey,),
body: Container(
child: GoogleMap(initialCameraPosition: _kGooglePlex,
mapType: MapType.normal,
onMapCreated: (GoogleMapController controler){
_controller.complete(controler);
});
},
)
);
}
1490 Views