Google Maps div grey?

 

Hi again!

This will be a very short shoot of a recent problem I have been in a project. The problem was related with Google Maps (gmaps V3).

The problem was in the div of the map, I get part of it in grey. But all the functionalities work, I get my pointers, I can zoom, move the map, but I still getting grey zones.

This picture will help you to understand if you have similar problem.

The most amazing think was that all the code that generate the map, and the position of the map were OK! I tried the same code outside where is has to be placed and everything works. My first thought was the CSS. I have been using complex CSS styles, but nothing worked.

The solution, of course, StackOverflow has the solution. The problem was that the div where GMaps is placed, in this case, in the beginning of the stage the div was hidden, it causes gmaps scripts doesn’t get correct sizes and prints locations in grey.

How to solve? In Stackoverflow they try to use fixed position, in my case, not the best solution. My solution, generate gmaps at the same time that the user try to show the hidden part of the page where where the map is it placed. The bad think, user will have to wait until Google returns all the data of the map, just a second. Strange problem, with difficult problem source, but with easy solution 😉

Stay cloud!

Leave a Reply

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies