0

最近 Google Map API を使い始め、自分の Web ページでhello world のサンプルを試してみました。元のコードとの唯一の違いは、マップ要素を次のように JavaScript コードで表示することです。

    function showMap () {
        container = document.getElementById("id_container");
        container.innerHTML = "<div id=\"map_canvas\"><\/div>";
        var mapOptions = {
            center: new google.maps.LatLng(-34.397, 150.644),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
    }

そして外部cssファイルでは、#map_canvasの固定値で幅と高さを定義しました。

しかし、期待した結果は得られませんでした。マップは約 1 秒間表示され、すべて白くなりました (下の画像を参照)。地図をズームすると、点滅しているのがわかります。Googleで検索しましたが、解決策が得られず、問題が何であるかさえわかりません。誰かが以前に同じ問題に遭遇したことがありますか?

4

1 に答える 1

1

数日間試してみた結果、何が起きているかがわかった -

すべての div の背景属性を白に設定しました。マップ div の背景を「なし」にリセットしましたが、機能しません。唯一の解決策は、「div {background-color: white;}」のように、背景が「なし」ではない可能性のある定義を避けることです。

ただし、親タグの背景色は自由に設定してください。

于 2012-10-06T01:40:09.963 に答える