on the yeoman-ionic framework i've tried to add google map to my app.the problem was that every time i ran grunt serve the index.html scripts got deleted. so i've ran this:bower install --save angular-google-maps and the problem solved since it wrote the scripts on some other file in addition to index.html. the only problem is when i ran grunt serve againt i got a diffrent error and ever since then i just can't figure out what i am doing wrong...
the error:
Uncaught ReferenceError: google is not defined
i think it has something to do with some karma config file although i have no idea what this is. tried to solve this for a couple of hours and couldn't figure this out...
I was getting that error too. It turned out to be related to the order in which I loaded my script files. Try loading your script files in this order:
<script src='//maps.googleapis.com/maps/api/js?sensor=false'></script>
<script src='/path/to/underscore[.min].js'></script>
<script src='/path/to/lodash.underscore[.min].js'></script>
<script src='/path/to/angular-google-maps[.min].js'></script>
Best!
You must use Google Maps SDK Async Loader.
It guarantees that angular-google-maps does not begin processing any directives until all of the Google Maps SDK is fully ready.
Configure:
.config(function(uiGmapGoogleMapApiProvider) {
uiGmapGoogleMapApiProvider.configure({
// key: 'your api key',
v: '3.20', //defaults to latest 3.X anyhow
libraries: 'weather,geometry,visualization'
});
});
When is Google Maps SDK ready?:
.controller("someController", function($scope, uiGmapGoogleMapApi) {
uiGmapGoogleMapApi.then(function(maps) {
// write your code here
// (google is defined)
});
});
Also you can read this http://angular-ui.github.io/angular-google-maps/#!/api/GoogleMapApi