Angular google maps not working http://angular-ui.github.io/angular-google-maps/#!/

Am new to ionic , I have tried to configure angular-google-maps for a day now with no success how is it done , some tutorials will help me. Thanks

1 Like

could you make a small codepen of it? i’ve used angular-google-maps quite some times now and i think it’s great here’s a working pen of mine with a map http://codepen.io/sjerd/pen/yjafu

Hello reviloera,

I also had to figure things out on my MAC and spend some time getting Google Maps to work in our app. It is better to use the native Google Maps. It has a much better performance on your mobile device since it uses SVG rather than PNG images. But you’ll need to have an API Key.
Here’s a good tutorial for Mac users and a tutorial for PC users Below I’ll try to briefly explain how you can do Google Maps integration on Android.

Set environment paths in your bashprofile

~ nano .bash_profile

add lines (according to your paths!)

export ANDROID_HOME=/usr/local/Cellar/android-sdk/<versionnumber>/
export PATH=${PATH}:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools

Install Apache Ant

Create an API Key and get the Cordova plugin:

  • Create a Google account if you don’t have any
  • Go to Google APIs Console (https://console.developers.google.com)
  • Register your project and turn on Google Maps Android API v2
  • Go to API Access page. (APIs & Auth > Credentials)
  • Click [Create New Key ] button.
  • In the resulting dialog, enter the SHA-1 fingerprint, then a semicolon, then your
    application’s package name (= -element in your config.xml) . Write down the API Key

run this command:

cordova plugin add plugin.google.maps --variable API_KEY_FOR_ANDROID="YOUR_ANDROID_API_KEY_IS_HERE" --variable API_KEY_FOR_IOS="YOUR_IOS_API_KEY_IS_HERE"

Read these docs to discover the great features of the plugin

Make sure to include the ng-cordova.js file BEFORE the cordova.js script

Hope this helps!

Sorry for the late reply I was unwell , thanks for the link really helpful

Sorry for the late reply I was unwell , your codepen opened my eyes BIG THANKYOU the map is working . Am experiencing one more problem sorry for asking so much but I cant launch android navigation from the map

I have solved it by having this < access origin="geo:*" launch-external="yes" /> in config.xml