Google Map renders quaterly inside div. browser resize renders the map properly

Question

I am using gmap, drupal 6 on pantheon . My gmap occurs quaterly in its own div, when the page refreshes.

I have checked with gmap resize() option . it did not work . Even I have tried to load the gmap, when the tab(the map is inside "view map" tab not jquery UI tab) is clicked, it did not work there too. The map is not inside iframe. When the browser is re-sized or inspect element tool is opened for debugging, the map appears but the matker is not visible. The marker goes outside of the given width-height.

Google Maps not rendering completely on page? did not help me.

Please suggest.

Answer 1

1. Are you rendering the "#map-canvas" HTML div programmatically?
   In that case, make sure that the DOM is ready before trying to render the Map.

2. Apply: google.maps.event.trigger(map, 'resize'); I had to use this to prevent gray areas => But I guess this is what you've tried already?

3. Check the map dimensions in the Google Chrome Element inspector.