如果嘗試第二次請求，則Google Map無法為同一div正確呈現

Question

我有主/子類型頁面。 在母版頁中，有一個打開詳細信息頁面的鏈接。 在詳細信息頁面上，我正在顯示地圖。 在帶有Ajax調用的精美框中打開“詳細信息”頁面。 在第一次點擊詳細頁面時，我將google腳本附加到頁面上。 由於腳本已添加到DOM，因此我不會從下一個詳細信息單擊中添加Google腳本。 單擊詳細信息頁面的第一次迭代時，Map會正確加載，但是此后Map無法正確呈現。 地圖僅在div的一半中呈現。

如下代碼片段

var instanceTime = 0
function loadgoogleapiInfoPopup() {

    mapCanvasId = "map_canvas_gdi";
    if (instanceTime == 0)
    {
        instanceTime = 1;
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.id = 'GoogleAPIMapInfoPop';
            script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&' + 'callback=infopopup.Init';
            document.body.appendChild(script);
        }
    else {

        $("#map_canvas_gdi").html('');        
        infopopup.Init();
        google.maps.event.trigger(infopopup.Map, 'resize');

    }
}

infopopup.Init = function () {    
    function initialize() {
        var center = new google.maps.LatLng(53.961687, -1.746825);

        var options =
        {
            zoom: 6,
            center: center,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        infopopup.Map = null;
        infopopup.Map = new google.maps.Map(document.getElementById(mapCanvasId), options);


    }

    initialize();
    infopopup.ClearMarkers();
    infopopup.FillMarkers();
}

Answer 1

謝謝..問題解決了，我已應用google.maps.event.trigger（garagemapinfopopup.Map，'resize'）; 在父頁面中，在子項加載到div后。