花式盒子和谷歌地图答案

【问题标题】：Fancy Box and Google Maps花式盒子和谷歌地图
【发布时间】：2015-12-31 15:38:54
【问题描述】：

我正在尝试使用 fancyBox2 来显示 Google 地图。当我将演示页面 (http://webdesignandsuch.com/posts/fancybox-download/google-maps-fancybox/fancybox-google-maps.html) 上存在的适当链接复制并粘贴到我的网页中时，地图就可以正常工作。这是该链接的副本。

<a class="various fancybox.iframe" title="Yankees Suck!" href="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=fenway+park&amp;sll=42.291762,-71.425894&amp;sspn=0.20368,0.315514&amp;ie=UTF8&amp;hq=Fenway+Park&amp;hnear=Fenway+Park,+4+Yawkey+Way,+Boston,+Massachusetts+02215-3409&amp;z=14&amp;iwloc=A&amp;cid=10154405128186028253&amp;ll=42.346751,-71.096946&amp;output=embed"><img src="demo/img1s.jpg"></a>

但是当我尝试用不同的地图替换上面的地图时，我无法让地图出现，尽管模式窗口可以正常工作。我不确定错误在哪里。这是我想使用的地图位置。

https://www.google.com/maps/place/Parque+Nacional+Manuel+Antonio,+Cant%C3%B3n+de+Aguirre,+Puntarenas/@9.392308,-84.1369879,16z/data=!4m2!3m1!1s0x8fa1719c9ba9f54b:0x95e66139ce5c4a86

有人可以说明正确的链接应该是什么样子吗？感谢您提供的任何帮助。

亲切的问候，

标记

【问题讨论】：

标签： google-maps fancybox-2

【解决方案1】：

如果我使用 jquery 1.7.1 并使用提供的“嵌入”URL（以下说明），它适用于我。

我将示例中的 URL 替换为来自 your linked map 的 URL（我单击“Parque Nacional Manuel Antonio, Cantón de Aguirre, Puntarenas”左侧的“汉堡菜单”，然后单击“共享或嵌入”，然后在“嵌入地图”选项卡上。iframe 内的 URL：<iframe src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d7872.6622650279005!2d-84.1369879!3d9.392308!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sus!4v1451580267451" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>)

Live example

网址是：

href="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d7872.6622650279005!2d-84.1369879!3d9.392308!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8fa1719c9ba9f54b%3A0x95e66139ce5c4a86!2sParque+Nacional+Manuel+Antonio!5e0!3m2!1sen!2sus!4v1451580042799"

【讨论】：

您好，非常感谢您的回复。我正在使用查询 1.7.1，程序运行良好。问题出在地图上。
地图有什么问题？它在我的答案中的链接中有效吗？
您好，感谢您的帮助。您的链接/示例工作得很好，正如我上面提到的，我可以让 Fancybox 正常工作。我想要做的是使用文本链接来触发 Fancybox，然后它会显示地图。我不想像您的示例那样使用 iframe 标记将地图嵌入网页上。有没有办法做到这一点？谢谢。
据我所知，嵌入式谷歌地图需要在 iframe 中。如果您不想这样，您可能需要使用 Google Maps Javascript API v3 来制作您的地图（或静态地图）。
好的，谢谢。理想情况下，我希望将地图嵌入某种弹出窗口中，而不是网页本身。