Flutter Google Maps API Tutorial | Markers, Polylines, & Directions API

preview_player
Показать описание
» Flutter courses, writeups, and source code on Launch Club 🧠

» Flutter Job Board 👋

Learn how to add Google Maps to your Flutter apps. I'll go over how to add map markers, create info windows, make HTTP requests to the Google Directions API for route information, display polylines, and animate the map camera.

Note: When you add a billing account to your project for the Directions API, you also get $200 in credit that gets applied to your account every month. That's 40,000 free calls ($0.005 per request for the first 100,000 requests) for the Directions API.
"For each billing account, for qualifying Google Maps Platform SKUs, a $200 USD Google Maps Platform credit is available each month, and automatically applied to the qualifying SKUs."

» Remember to like, subscribe, comment, and share this video!🚨

» Socials📱

» Resources 📂

» Timestamps 🕒
00:00 Flutter Google Maps Tutorial Introduction
00:49 Pubspec Packages
01:12 Google Maps API Key
01:34 Google Maps Setup Android and iOS
02:00 Adding Our Map
02:45 Animate Map Camera to Location
03:31 Add Map Markers by Long Pressing
05:29 AppBar and TextButtons
06:00 Google Directions API - DirectionsRepository
07:21 Directions Model - Parsing JSON
08:36 Get Directions Info
09:09 Animate Map Camera to LatLngBounds
09:24 Distance & Duration Container
09:49 Display Polylines / Route
10:13 Recap
10:44 Thanks for watching 🙏

» Music 🎶

#Flutter #FlutterGoogleMaps #FlutterTutorial
Рекомендации по теме
Комментарии
Автор

Honestly bruh I'm only 40 seconds in and I'm already a like smasher & subscriber. Thanks for all you do!

dakevs
Автор

Thank You Marcusng for this one...This is Super-Helpful

chuxville
Автор

Wow, this was such a complete and helpful tutorial, everything was well explained, thank you so much! 💯

luisxd
Автор

dang bro, you go super god mode right now.

shanglee
Автор

The best one yet, Thank you so much!

Don't forget to put [bounds][northeast] if bounds are null in the get Directions

mzolisidywili
Автор

If there was love button i would also press bruh you inspire alot

joshuawarurii
Автор

Amazing tutorial for ivorian young man who learn fultter.

klkakeklkake
Автор

Nice video, learnt a lot from your channel. Can you please make a tutorial on how to write and read video files with firebase, since there not enough tutorials online to learn to handle videos? And videos are an essential feature of most apps.

bars_expression
Автор

what is the route and polyline based on? is it the shortest route? or what logic is the polyline is drawn off of

nbkdypj
Автор

Thanks for this.
Is it possible to add makers on the map and make them connected using this api, what needs to be changed?

raymondmichael
Автор

Is there a way to make the choices permanent unless reset by a button on the screen?

kentthomas
Автор

Hello, is there any way to set indications to the Exactly same Route Polylines? Like Navigation SDK google, but without the SDK

josecorona
Автор

Hi Sir, all went good but at last routes returning null and polyline doesn't show up, kindly help what should I do ???

ahmdhakimali
Автор

How do you do the step 'open Xcode' in Android Studio in windows? Thanks!

niklaswerthner
Автор

With which program do you use for the beginning of your videos?

esrayildirim
Автор

hello nice video, i see that few seconds after 3:25 your google maps seems "buggy" i have the same issue with road getting "biggers" and "blurry", did you find and fix or is it normal while using an emulator maybe ?

Pismice
Автор

Is it possible to add polylines if I have multiple markers and not just 2?

TheThunderize
Автор

Thanks, it helped me in the project))

nazar
Автор

The constructor being called isn't a const constructor.
Try removing 'const' from the constructor invocation. Im getting this error

jeffrey
Автор

Hi, great tutorial apart from that how to track the route live from one place to another and thank you.

kamalpreetsingh
welcome to shbcf.ru