google maps 地图显示不出来？答案

【问题标题】：google maps map wont show up?google maps 地图显示不出来？
【发布时间】：2017-03-03 05:39:39
【问题描述】：

var center = new google.maps.LatLng(18.133333, 21.566667);
var map = new google.maps.Map(document.getElementById('map'), {zoom: 11,center: center,mapTypeId: google.maps.MapTypeId.TERRAIN});

我的 html 中有一个名称映射的 DIV。

    <div id="map"></div>

JS 位于 myscript.js 中的一个名为 initialize 的函数中，我在 index.html 中引用了该函数

----------编辑---------- 谷歌地图参考

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

【问题讨论】：

你能告诉我们你是如何添加对谷歌地图的引用吗？你有没有尝试在 dom 就绪处理程序中使用？
对不起，我没听懂，你说的google map是什么意思？
你把sensor和api key放了吗？
您是否在 firebug 中收到任何错误消息？正如 Christophe 所说，尝试将其放入 dom 就绪处理程序中 -> 例如api.jquery.com/ready
在map api之后调用myscript.js吗？

标签： javascript google-maps-api-3

【解决方案1】：

在这个 div 上设置宽度和高度。

在 HTML 中

 style='width:500px; height: 500px'

或在 CSS 中

#map { width: 500px; height: 500px }

【讨论】：

您提供的内容没有错误。检查所有基本的东西： - 如果在你尝试使用之前加载了谷歌地图脚本， - 如果你的脚本甚至被执行（在它之后添加一些 alert 并检查它是否出现）等等。

【解决方案2】：

你确定你把你的谷歌地图 CDN 放在你的 JavaScript CDN 之后吗？

<!-- Add jQuery-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Add google maps API -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=place your api key here&callback=initMap"></script>
<script src="assets/js/googleMapsApi.js"></script>

【讨论】：