在请求之前隐藏 Google Maps API答案

【问题标题】：Hide Google Maps API until requested在请求之前隐藏 Google Maps API
【发布时间】：2018-08-11 21:54:27
【问题描述】：

我不会添加任何代码，因为这应该相当简单。如果我想加载 Google Maps API 并将其嵌入到我的页面中，但我想隐藏它的可行性，直到用户单击按钮或链接，我该怎么做？

我不是在谈论 API 中的标记和图标，我想隐藏谷歌地图使用的元素本身，我认为它是 iframe？

理想情况下，我希望用户单击“方向”按钮，该按钮将谷歌地图 API 作为同一页面中的弹出窗口打开。允许用户在需要时关闭弹出窗口并返回到他们在页面上的位置。

谁能指出我正确的方向？ TIA

【问题讨论】：

假设 Google Maps 指示您将特定的 HTML 添加到将地图绑定到的页面中，为什么不使用“display: none”的 CSS 初始化该 HTML，然后当用户单击您的按钮时, 将该元素的 CSS 更改为“display: block”？

【解决方案1】：

如果你查看他们给你的<script> 标签，它看起来像这样：

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

只需取出&callback=initMap 部分。然后，当用户点击打开弹出窗口时，从您的代码中调用initMap()。

jQuery：$('#mapPopup').click(initMap);

【讨论】：