0

こんにちは、私は Google Maps API v3 とジオコーダーを使用して地図を表示してきましたが、これまでのところうまく機能しています。同じページに別のマップを表示しようとすると、最初のマップのみが読み込まれます。2 番目のマップは単にグレーの領域を示しています。マップがロードされていません。複数のジオコーダー リクエストを実行する必要がありますが、どうすればよいですか。これまでの私のコードは次のとおりです。

    var geocoder;
var map;
var map2;
var marker;
var infobox;

function initialize() {
            //Geocoder
        geocoder = new google.maps.Geocoder();
        var address = 'Times Square, New York'; 
        geocoder.geocode( { 'address': address }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
            //Marker
            var companyLogo = new google.maps.MarkerImage('images/pin.png',
                new google.maps.Size(20,20),
                new google.maps.Point(0,0),
                new google.maps.Point(10,10)
                );
            //Marker shadow 
            var companyShadow = new google.maps.MarkerImage('images/pin_shadow.png',
                new google.maps.Size(25,33),
                new google.maps.Point(0,0),
                new google.maps.Point(0, 25)
                );
            //Display the marker
            var marker = new google.maps.Marker({
                map: map,
                icon: companyLogo,
                shadow: companyShadow,
                position: results[0].geometry.location,
                title:"Some title"
            });
            //Infobox
            infobox = new InfoBox({
                content: document.getElementById("infobox"),
                disableAutoPan: false,
                maxWidth: 320,
                pixelOffset: new google.maps.Size(-142, -150),
                zIndex: null,
                boxStyle: {
                    opacity: 1,
                    width: "300px"
                    },
                closeBoxMargin: "0px",
                closeBoxURL: "images/close_tooltip.png",
                infoBoxClearance: new google.maps.Size(1, 1)
                });
                        //Open infobox
            google.maps.event.addListener(marker, 'mouseover', function() {
                infobox.open(map, this);
                map.panTo(geocoder);
                });

            } else {
                alert("Geocode was not successful for the following reason: " + status);
                }
            });

                    //Map options
        var myOptions = {
            zoom: 15,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableDefaultUI: true,
            scrollwheel: false
        }
    //Call Maps 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    map2 = new google.maps.Map(document.getElementById("map_canvas2"), myOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);
4

1 に答える 1

0

2番目のmyOptionsマップを設定するために使用するオブジェクトにはcenterプロパティが含まれていないため、2番目のマップを中央に配置することはできません。

ジオコーダーが呼び出されたら、最初のマップの中心を設定します。

map.setCenter(results[0].geometry.location);

ただし、2番目のマップは設定しません。

マップの中心を設定しないと、灰色のまま空になります。

于 2012-08-08T16:46:35.397 に答える