Displaying google maps in angular.js

Asked Sep 04 '14 at 18:33

Active Sep 04 '14 at 18:44

Viewed 219 times

I might be making a really silly mistake here, but I'm not sure where I'm going wrong. Just trying to get a simple map to display on page with google maps and angular.js.

Here is my controller..

var myApp = angular.module('myApplicationModule', ['google-maps']);
myApp.controller('IndexController', ['$scope', function ($scope) {
$scope.map = {
    center: {
        latitude: 45,
        longitude: -73
    },
    zoom: 8
};

}]);

And here is my html page..

<!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml" ng-app="myApplicationModule">
<head>
<title></title>
</head>
<body ng-controller="IndexController">
    <google-map center="map.center" zoom="map.zoom"></google-map>
    <script src='//maps.googleapis.com/maps/api/js?sensor=false'></script>
    <script src='/Scripts/lodash.js'></script>
    <script src='/Scripts/angular-google-maps.js'></script>
    <script src='/Scripts/angular.js'></script>
</body>
</html>

I have included all the necessary scripts and gotten angular.js from NuGet, declared my application and specified the controller.

However, the map is not displaying on the page.. Anybody able to point out why?

edited Sep 04 '14 at 18:44

asked Sep 04 '14 at 18:33

The Unculled Badger

Where's the reference to *angular.js* ? – m.e.conroy Sep 04 '14 at 18:38
Sorry, edited to show this.. – The Unculled Badger Sep 04 '14 at 18:44
You need to have *angular.js* listed before *angular-google-maps.js* – m.e.conroy Sep 04 '14 at 18:49
Thanks, but still no joy.. Could it be auto hidden on start up or do I need to apply a style? – The Unculled Badger Sep 04 '14 at 19:07
I don't think you need to apply a style. – m.e.conroy Sep 04 '14 at 19:13
Think I found your answer, check this out: http://stackoverflow.com/questions/23705447/angular-google-maps-does-now-show-correctly-when-its-hidden-at-start?rq=1 – m.e.conroy Sep 04 '14 at 19:16
Ok, I feel stupid now, the answer was to include my controller in the script.. – The Unculled Badger Sep 04 '14 at 19:21
1

m.e conroy, do you want to answer this so I can give some credit? – The Unculled Badger Sep 04 '14 at 19:21
1

Nah, its ok. Thanks though, glad you found the problem – m.e.conroy Sep 04 '14 at 19:24

Displaying google maps in angular.js

0 Answers0