GoogleMap offsetWidth problem

Question

i have a problem with displaying GoogleMap.

Here is the website source code: http://pastebin.com/LjhVbEF7

When i'm trying to run this website, map is not displayed. Firebug console says Uncaught TypeError: Cannot read property 'offsetWidth' of null

Have you any idea what am i doing wrong? I know that there are many working examples on the net but this code is generated by a special script and i'm not able to interfere it to much. Maybe i forgot to set some variables?

thanks, Mike

=================

EDIT: This code is working only when i'll put JS in function definition and call it in body onload param. Do you have any idea how can i make it working without using such function and onload param ?

Answer 1

I realise that this is probably a bit late - but hopefully it will be able to help someone else out:

In your case the initialise function is not firing, although it can also be caused by the width and height attributes not being set on the container div. If you don't want to simply add the load event to the body tag you can use the following jQuery:

//Add onload to body
$(window).load(function(){
    initialize()
});

Answer 2

Are you possibly working in AngularJS? I was, and this problem persisted past all the above solutions. The reason was that the partial where I located my map div was not completing in time, therefore the div was null, therefore the error you got.

See the Angular way to call GoogleMaps here:

Initialize Google Map in AngularJS

Answer 3

This is because your script runs before loading the DOM element. A simple solution is to put it into a function and trigger it when the loading is finished. Please refer to the question below:

Google MAP API Uncaught TypeError: Cannot read property 'offsetWidth' of null