Question

我今天在这里，因为我的谷歌地图javascript api版本3有问题。我的问题是谷歌地图没有出现..但你怎么能在这个屏幕上看到，在代码中有地图：< / p>

我已将代码插入jsfiddle（http://jsfiddle.net/05ktc2a6/）但不起作用。我刚尝试使用宽度和高度为100％的div但不起作用。

如果您愿意，我可以输入代码：

<body>

<div style="height:100%; width:100%;position:absolute;">
<div id="map"></div>
</div>
<script>
 var map;

function initMap() {

    map = new google.maps.Map(document.getElementById('map'), {
        center: {
            lat: 44.769503083884,
            lng: 10.431460571289
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 15,
        disableDefaultUI: true
    });
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCKKcVR26NAZ7j0zUtTY3Stu-DmcUhMW1E&callback=initMap"></script>
</body>

有人能帮帮我吗？几个星期agò它工作，我不知道是什么被添加:(

Answer 1

如果在元素上使用100％高度，但文档和文档正文没有指定高度，则浏览器无法计算高度...

您可以使用较新的vh小节而非百分比或将html, body的高度设置为100％来解决此问题。

#map {
    width: 100%;
    height: 100vh;
    border: 1px solid Aqua;
}

查看example on JSFiddle。

Answer 2

不确定这是否与10月11日更新后的问题相同，但我的地图也没有显示。

我必须解决两件事： < meta http-equiv="X-UA-Compatible" content="IE=edge" />（我使用了EmulateIE8，但不得不将其更改为边缘。我在某处读到googlemaps不再支持IE9了，所以这可能是原因）。

这解决了我在新窗口中的问题，但我在iframe中的地图仍显示为白色。

我不得不在googleapi.com电话中添加“v = 3”（不含引号），所以我现在正在使用此行：

< SCRIPT type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&v=3">

现在我的地图再次在IE（11），Firefox和Chrome中运行（我没有测试其他浏览器）。

希望这对你也有帮助。

Google Maps javascript api v3不显示地图

2 个答案: