Implement Google Maps Using Ionic Framework

Leverage the powerful Google Map's JavaScript API and Apache Cordova Geolocation plugin in your Ionic Framework Android and iOS mobile application.

Follow my blog or subscribe to my YouTube channel for other great programming tutorials.

[Praxia]

Thanks, Nic!  Truly fantastic work on ALL of your tutorials here. Keep up the great work - it's much appreciated! 

[dandansolosolo]

Hey Nic,
Simple great easy to follow tutorial.
Thanks!

[goldenchino]

I am looking to make a hybrid app and I was wondering which Google Maps API would I need to make it run in android/IOS?

[christiansanchezgomez]

Hi Nic,

navigator.geolocation shoud work when the app is offline (no Wifi, airplane mode, etc)? Do you know how can I use the hardware GPS with ionic?

[bhanukasamarasinghe]

Hi Nic! It's working fine when I integrate the code in index.html without ant errors. But how to integrate this code in an ionic view?

[InzHaque]

Could you incorporate this into an Angular directive rather than an Angular controller?

[KARAN]

how to stablize my ionic map application even in the slow network.
and also can you please share any of your blog regarding angular google map integration.
thanks in advance.

[alesresta]

I would like to keep tracking the device current position and update its maker on the map.
Does anybody have any hint about how i can accomplish that?

[shehanfonseka]

hello Nic can you show a tutorial of how to search several places and put markers using places library? a big help

[marevalo]

Thanks a lot! Your tutorial is super useful and easy.

[gugasevero]

Hi Nic!
I created an app that in one of it's page, screens there is a map from google.
The problem is that the map doesn't appears when the screen is loaded, I have to refresh the screen to load the map.
How can I send my codes for you to check?

[kawesakpajjai]

Hi ser . it's not worked in device but work in vistual

[yazeedshaker]

Thanks for your tutorial, it helped me a lot
I just had a simply issue and i was able to figure it out, The map was not loading and i had no errors
so i added the ng-controller="MapController" to the ion-content and everything was good
Hope it help anyone

[ApsaraAruna]

nice tutorial..i like it and very useful.. if you can make the video ZOOM the coding area..we hope you can do it for next new video.. thank you again..

[bilalahmedsyed]

Thanks for the video man.
Can you tell how to place markers on a set of locations using and array/object containing pairs of Latitude and Longitude.?Example set of coordinates:
var arr=[{1.14147, 1.478985}, {2.14147, 2.478985},

[durnevm]

main problem of this approach is unlimited API key, so it possibly can be used on any other website or app.

[rodolfolugo]

Thanks Nic Raboy.
I follow all steps from your tutorial and all works fine in the browser, but when I try to run in my device the map not show.

Can you share the github of this example? I try many tutorials and i can't show the map in the device.

maybe I have any other problem(maybe with the device). I you share your code with me I can try run this code in my device and confirm if the problem is my device or my code.

I will be very grateful with you, please help me

[gugasevero]

Hi Nic!
How to add mark on this tutorial?

[christiandannielchavezjime]

Solucionado

con ello se podra visualizar el map en los dispositivos. Saludos,