谷歌地图api v3白色叠加

Question

我最近开始使用Google Map API，并在自己的网页上尝试了hello world sample。我的代码与原始代码的唯一区别是我在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上搜索过，但我没有得到任何解决方案，我甚至不知道问题所在。有没有人遇到过同样的问题？

Answer 1

经过几天的尝试，我知道发生了什么 -

我将所有div的background属性设置为白色。虽然我将地图div的背景重置为“无”，但它不起作用。唯一的解决方案是避免任何可能给它带来非“无”背景的定义，例如“div {background-color：white;}”。

但是，可以随意设置其父标签的背景颜色。