Google Maps v2 в Shadowbox, работает только в Webkit

Question

Я пытаюсь открыть пользовательскую карту Google с помощью Shadowbox (адаптер jQuery). Мой код прекрасно работает в браузерах Webkit, но показывает пустое (черное) окно с тенями в FF, IE и Opera. Вот мой код:

//map
$('.map').click(function() {
    Shadowbox.open({
        player:     'html',
        content:    '',
        height:     300,
        width:      500,
        options:    {
            onFinish: function(item) {
                //create map
                var body = document.getElementById(Shadowbox.playerId);
                var map = new GMap2(body);
                map.setCenter(new GLatLng(45.7311, 21.2320), 16);

                //create icon
                var marker_icon = new GIcon(G_DEFAULT_ICON);
                marker_icon.iconSize = new GSize(35, 38);
                marker_icon.iconAnchor = new GPoint(17, 30);
                marker_icon.image = 'http://domain.com/images/map-marker.png';

                //add marker

                var point = new GLatLng(45.7311, 21.2320);
                map.addOverlay(new GMarker(point, {icon: marker_icon}));

                //add some simple controls
                map.addControl(new GSmallMapControl());
                map.addControl(new GMapTypeControl());
            }
        }
    });
});

//shadowbox
Shadowbox.init();

Answer 1

Хотя я не выяснил причину, по которой вышеприведенный код не работает (возможно, это просто потому, что он устарел), миграция кода в Maps API V3 решает эту проблему.

//map
$('.map').click(function() {
    Shadowbox.open({
        player:     'html',
        content:    '',
        height:     300,
        width:      500,
        options:    {
            onFinish: function(item) {
                //create map
                var map = new google.maps.Map(document.getElementById(Shadowbox.playerId), {
                    center: new google.maps.LatLng(45.7311, 21.2320),
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    zoom: 16
                });

                //add marker
                var marker = new google.maps.Marker({
                    icon: 'http://domain.com/test/images/map-marker.png',
                    map: map,
                    position: new google.maps.LatLng(45.7311, 21.2320)
                });
            }
        }
    });
});