Angular-Google-Maps library not loading

Question

I use angularjs and node for my application, and I want to integrate google maps in my app. I use this set of directives http://angular-ui.github.io/angular-google-maps/#!/,

Problem that is showing up is this:

Uncaught Error: [$injector:modulerr]    h  ttp://errors.angularjs.org/1.6.2/$injector/modulerr?p0=VisualiseATM&p1=Err…    at%20Mc%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A21%3A332)
at angular.min.js:6
at angular.min.js:41
at q (angular.min.js:7)
at g (angular.min.js:40)
at db (angular.min.js:45)
at c (angular.min.js:21)
at Mc (angular.min.js:21)
at qe (angular.min.js:20)
at angular.min.js:331
at HTMLDocument.b (angular.min.js:37)

Specifically, it's problem with:

Module 'uiGmapgoogle-maps' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Here is my angular code:

var app = angular.module("VisualiseATM", [ 'uiGmapgoogle-maps',
'ui.router'
, 'controllers'
, 'ngCookies'
, ]);

app.config(function(uiGmapGoogleMapApiProvider) {
uiGmapGoogleMapApiProvider.configure({
    key: 'MY_API_KEY',
    v: '3.20', //defaults to latest 3.X anyhow
    libraries: 'weather,geometry,visualization'
});
})

app.config(['uiGmapGoogleMapApiProvider', function(GoogleMapApiProviders) {
    GoogleMapApiProviders.configure({
        china: true
    });
}]
);

I found this on internet, but I'm not sure how to use it in my app. https://github.com/angular-ui/angular-google-maps/issues/1489

I'm awared that I have to use this angular-simple-logger, but don't know how to integrate it with my code.

I hope that you'll give me an answer. Thank you a lot!

Have you loaded angular-google-maps.js into your document? — lin
– lin, Commented Mar 26, 2017 at 21:48
I have installed it using npm install and I include it in my document. But still it doesn't work. — Ben
– Ben, Commented Mar 26, 2017 at 22:01
check calling the lib after angular library and before your application script — Modar Na
– Modar Na, Commented Mar 26, 2017 at 22:27
Use angularjs-google-maps. It is actively maintained and doesn't have dependencies on lodash and angular-simple-logger. — georgeawg
– georgeawg, Commented Mar 27, 2017 at 2:52

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

Angular-Google-Maps is no longer maintained

Instead use AngularJS-Google-Maps

<script src="https://maps.google.com/maps/api/js?libraries=placeses,visualization,drawing,geometry,places"></script>
<script src="https://unpkg.com/angular/angular.js"></script>
<script src="https://unpkg.com/ngmap"></script>

The DEMO on PLNKR

OR use Angular-Google-Maps older version 2.1.6. It doesn't need angular-simple-logger:

  <head>
    <script src="//unpkg.com/angular/angular.js"></script>
    <script src="//unpkg.com/[email protected]"></script>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body ng-app="app">
    <h1>Angular Google Maps</h1>
  </body>

The DEMO on PLNKR.

Angular-Google-Maps

Project No longer actively maintained

With angular 2 and other competing projects we have decided to announce that this project is no longer activley maintained. If someone desires to take over the project please contact any of the admins.

As a warning this project is not activley watched by the admins and is checked [from time to time] to fix any major issues. Therefore if something is major, contact someone directly via mentioning a users name/alias (will notify the user/admin).

Alternatives:

angularjs-google-maps

angular2-google-maps

— GitHub Angular-Google-Maps

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Mar 27, 2017 at 5:27

georgeawg

49k13 gold badges78 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ben Over a year ago

Thank you, I used angularjs-google-maps, but I had to include this in my document: <script src="maps.google.com/maps/api/…> <script type="text/javascript" src="ajax.googleapis.com/ajax/libs/angularjs/1.4.5/…> <script type="text/javascript" src="rawgit.com/allenhwkim/angularjs-google-maps/master/build/…> You can find example here: plnkr.co/edit/iYYRyr?p=preview

georgeawg Over a year ago

angularjs-google-maps is available on UNPKG CDN as unpkg.com/ngmap

Collectives™ on Stack Overflow

Angular-Google-Maps library not loading

1 Answer 1

Angular-Google-Maps is no longer maintained