嵌入谷歌地图不以特定网络上的位置为中心

Question

我使用嵌入谷歌地图来渲染具有特定位置的特定页面上的动态位置的地图。 iframe包含带有q=参数的Google嵌入地图的网址以检索位置。例如：

<iframe height="200" frameborder="0" style="border:0; width:100%;" src="https://www.google.com/maps/embed/v1/place?key=GOOGLE_API_KEY_HERE&q=Fabryczna+20A,+Kraków,+Poland" allowfullscreen></iframe>

通常它渲染得很好，就像这里：

但奇怪的是，有时在相同的浏览器上，它呈现的硬件就像没有提供地址一样：

我所观察到的 - 它似乎与不同的网络（但不是网络速度）有关 - 所以例如我能够使用我的家庭wifi查看地图，但是当我切换到我的办公室网络时，或移动（例如使用个人热点和蜂窝网络）问题将会发生。

发生此问题时，iframe src与不存在时相同。但iframe的内容会发生变化。

如何处理这个问题？

由于

Answer 1

有一个相当简单的解决方案。它与Google API密钥有关。如果您想在网站上嵌入您的位置，我建议您使用Google地图提供的嵌入功能。

简单操作如下：

在Google地图中输入您的位置＆gt;分享＆gt;嵌入地图。

你最终会得到这样的代码：

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2488.201651849343!2d19.975045070729283!3d50.06547331892074!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47165b28caac7d19%3A0xbd9f87d30b21ac38!2sFabryczna+20A%2C+Krak%C3%B3w%2C+Poland!5e0!3m2!1sen!2snl!4v1510144269138" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

您还可以在嵌入地图之前滚动来确定嵌入式Google地图中的内容。

希望这有帮助！