0

Shadowbox (jQuery アダプター) を使用してカスタム Google マップを開こうとしています。私のコードは 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();
4

1 に答える 1

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)
                });
            }
        }
    });
});
于 2013-07-24T18:09:47.397 に答える