Question

Custom map is broken on satellite view, does not show satellite imagery. Any ideas, what’s wrong? Overlays are also broken – they’re not transparent.

Code:

<div id="map_canvas" class="grid_8 omega" style="width:460px; height: 420px"></div>
<script src="http://maps.google.com/maps?file=api&amp;v=3&amp;sensor=true&amp;key=my-key-is-here" type="text/javascript"></script>
<script type="text/javascript">
    function initialize() {
        if (GBrowserIsCompatible()) {
            var map = new GMap2(document.getElementById("map_canvas"));
            map.setCenter(new GLatLng(52.229676, 21.012229), 13);
            map.setMapType(G_HYBRID_MAP);
            map.setUIToDefault();
        }
        var geocoder = new GClientGeocoder();
        function showAddress(address) {
            geocoder.getLatLng(address, function(point) {
                if (!point) {
                    alert('Nie można znaleźć adresu: '+address);
                } else {
                    map.setCenter(point, 13);
                    var marker = new GMarker(point);
                    map.addOverlay(marker);
                    marker.openInfoWindowHtml(address);
                }
            }
            );
        }
        showAddress('some address goes here')
    }
    $('body').ready(initialize);
    $('body').unload(GUnload);
</script>

Answer 1

This was due to a css setting:

img {
    background: #FAFAFA;
}