Google map is not visible in jquery modal dialog
===

I wan't to display google map in jquery ui modal dialog.<br/>
I open dialog but map is not visible.<br/>
However it exists in there it just not visible.<br/> 
This is page source:<br/>

    <div class="dialog ui-dialog-content ui-widget-content" id="photoLocation" style="padding: 0px; background-color: rgb(255, 255, 255); overflow: hidden; width: auto; min-height: 0px; height: 390px; background-position: initial initial; background-repeat: initial initial; " scrolltop="0" scrollleft="0">
    <div id="map" style="width: 300px; height: 300px;">
            </div>
            </div>

It seams that z-index is wrong somehow but I have tried to change it on map div but that doesn't help.
When I open modal dialog this is code in there that should display map.

    <script>
        
        var map;
    
        var styleArray = [
                          {
                              featureType: "all",
                              stylers: [
                              { visibility: "off" }
                            ]
                          },
                          {
                              featureType: "road",
                              stylers: [
                              { visibility: "on" }
                            ]
                          },
                          {
                              featureType: "administrative",
                              stylers: [
                              { visibility: "on" }
                            ]
                          }
                        ];
    
        (function () {
            window.onload = function() {
                var mapDiv = document.getElementById('map');
    
                var latlng = new google.maps.LatLng('44.339565', '-114.960937');
                var options = { styles: styleArray,
                    center: latlng,
                    zoom: 15,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    mapTypeControl: false
                };
                map = new google.maps.Map(mapDiv, options);
    
                var marker = new google.maps.Marker({
                        position: latlng,
                        icon: '../Content/Pointer.png',
                        map: map,
                        draggable: true
                    });
            };
        })();
    </script>
    <div id="map" style="width: 300px; height: 300px;">
            </div>
            