Javascript 谷歌地图未在网站中加载_Javascript_Html_Css_Google Maps

Javascript 谷歌地图未在网站中加载

javascript html css google-maps

Javascript 谷歌地图未在网站中加载,javascript,html,css,google-maps,Javascript,Html,Css,Google Maps,我正在尝试将谷歌地图整合到我的网站中，我不知道我做错了什么。我的代码和谷歌的一模一样，只是我对CSS做了一点修改，但我把我的换成了他们的，结果还是不起作用。有人看到我没有看到的东西吗 <head> <style> #map { width: 100%; height: 500px; background: #CCC; } </style> </head> <body> <

我正在尝试将谷歌地图整合到我的网站中，我不知道我做错了什么。我的代码和谷歌的一模一样，只是我对CSS做了一点修改，但我把我的换成了他们的，结果还是不起作用。有人看到我没有看到的东西吗

<head>
  <style>
    #map {
      width: 100%;
      height: 500px;
    background: #CCC;
    }
  </style>
</head>
<body>
  <div id="map"></div>
  <script>
    function initMap() {
      var mapDiv = document.getElementById('map');
      var map = new google.maps.Map(mapDiv, {
        center: {lat: 44.540, lng: -78.546},
        zoom: 8
      });
    }
  </script>
  <script src="https://maps.googleapis.com/maps/api/js" async defer></script>
</body>


#地图{
宽度：100%；
高度：500px；
背景：#CCC；
}
函数initMap（）{
var mapDiv=document.getElementById（'map'）；
var map=new google.maps.map（mapDiv{
中心：{lat:44.540，lng:-78.546}，
缩放：8
});
}

您忘记实际运行初始化功能。只需在函数声明之后调用函数，它就可以工作了

function initMap() {
  var mapDiv = document.getElementById('map');
  var map = new google.maps.Map(mapDiv, {
      center: {lat: 44.540, lng: -78.546},
      zoom: 8
  });
}
initMap();

编辑：如问题的几个注释中所述，这也可以通过向脚本src添加

&callback=initMap

来实现：

<script src="https://maps.googleapis.com/maps/api/js?callback=initMap" async defer>

googlemapsapi警告：noapikes您没有调用

initMap

方法。将

&callback=initMap

添加到脚本include或使用onload函数调用它。geocodezip完全正确。您需要

的地方，您的说明中缺少回调。明白了。我按照你给我的链接上的说明去做了，它是有效的，我就是不知道如何在其中添加默认地址。我不明白为什么谷歌没有指定你需要创建一个API密钥。谢谢大家！我也算出了位置部分。我感谢你的帮助！建议：当有人发布了一个很好的答案时，即使是一条评论，也只需向上投票。荣誉geocodezip@zipzit如果我开始写这篇文章时有任何评论，那正是我应该做的。但事实并非如此。@zipzit:如果没有“真实”的答案（可能会被接受），没有人会知道这个问题已经解决。没有任何注释包括在函数声明后调用函数……这个答案是一种不同的方法，具有相同的结果