Google maps api async loading - have tried all the solutions - going insane

Question

I'm trying desperately to finish this project

http://kenziejoy.github.io/frontend-nanodegree-map/

(that is the gh-pages branch, the master is a little behind)

and while tinkering with other things my map disappeared...forever. I can't find what is wrong. I feel like I've tried everything: async, defer, async defer, callback to a function in the html that then calls a function in the js file (someone suggested it), initmap inside the viewmodel, outside the viewmodel, everything wrapped in a self running function.

Most of my errors are either, my callback isn't a function, google isn't defined or something in my js file isn't defined.

I've poured through to make sure it isn't something silly like a misplaced comma - but I'm getting so frustrated I've probably made a stupid mistake somewhere. Just any help would be really appreciated. At least so I can get a map up there and make some progress on everything else.

Answer 1

Looking at the code in your link In the app function in you main.js is not declared the googleMap var globally.

you must declare

var googleMap ;

in top of you main.js