У меня была похожая проблема, когда я использовал GoogleMaps API в диалоге интерфейса пользователя Jquery, div карты был бы серым. Я исправил эту проблему, изменив размер карты, когда открыл диалог. Я также использую плагин GMAP3 Jquery.
Вот функция изменения размера:
function resizeMyMap() {
var mymap = $('#map_canvas').gmap3({ action: 'get', name: 'map' });
google.maps.event.trigger(mymap, "resize");
$('.gmap3').gmap3({
action: 'autofit'
});
}
Если вы не используете плагин GMAP3 Jquery, попробуйте изменить размер карты:
google.maps.event.trigger(map, 'resize')