Google Maps API - infobox.js 和 markerwithlabel.js - google 未定义答案

【问题标题】：Google Maps API - infobox.js and markerwithlabel.js - google is not definedGoogle Maps API - infobox.js 和 markerwithlabel.js - google 未定义
【发布时间】：2017-05-05 05:25:03
【问题描述】：

在我的 google maps webapp 中，我继续收到此错误：

infobox.js:126 Uncaught ReferenceError: google is not defined

首先由此触发，在 infobox.js 中：

InfoBox.prototype = new google.maps.OverlayView();

我已经阅读了几篇关于这个确切主题的堆栈文章，包括：

这是我的<head> 部分：

    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
    <script type="text/javascript" src="paypal/lightbox.js"></script>
    <script async defer src="https://maps.googleapis.com/maps/api/js?v=3&key=AIzaSyD1vT***********1s6tNOgL2F44P8&callback=initialize&libraries=places"></script>
    <script type="text/javascript" src="js/TreasureHunt.js"></script>
    <script type="text/javascript" src="js/infobox.js"></script>
    <script type="text/javascript" src="js/markerwithlabel.js"></script>

TreasureHunt.js 内部是我的 initialize() 函数：

function initialize() {
    // set up basic/default world map, zoomed out, showing globe
    var mapOptions = {
  ...
    }
}

我尝试将 js 引用移动到不同的位置，但没有任何效果。谷歌强迫我使用&callback=initialize 方法，否则我的地图根本不会加载。我曾经能够使用google.maps.event.addDomListener(window, 'load', initialize); 而不是异步，但这不再有效，地图根本无法加载。我曾尝试在地图 API js 文件之前和之后放置 TreasureHunt.js，但没有任何效果。总是在 infobox 和 markerwithlabel 内，它认为 google 对象不存在。

我做错了什么？

（注意：1 年前，这一切都运行良好，直到有一天我的本地地图 js 脚本停止工作并且谷歌现在需要从他们的服务器引用 js - 所以我修复了它，然后出现了这些其他问题。）

【问题讨论】：

从谷歌地图脚本中移除异步和延迟
并删除回调=初始化。如果你异步加载 API，所有依赖它的东西都必须在回调函数中，或者一定要在回调之后运行。
如原帖所述，当我删除回调 = 初始化时，地图不会加载。这就是我必须这样做的全部原因。谷歌地图文档说要这样做。还有，为什么会无缘无故投反对票？
您的问题中没有包含minimal reproducible example，因此我们可以看出您的代码/页面中的其他地方没有调用initialize。

标签： javascript google-maps

【解决方案1】：

更改脚本包括：

<script async defer src="https://maps.googleapis.com/maps/api/js?v=3&key=AIzaSyD1vT***********1s6tNOgL2F44P8&callback=initialize&libraries=places"></script>

到（删除async defer和&callback=initialize）：

<script src="https://maps.googleapis.com/maps/api/js?v=3&key=AIzaSyD1vT***********1s6tNOgL2F44P8&libraries=places"></script>

添加（DOM 渲染后调用初始化函数的代码）：

google.maps.event.addDomListener(window,'load',initialize);

【讨论】：