【问题标题】:Place Google maps Info window below marker (with pixeloffset?)将 Google 地图信息窗口置于标记下方(使用像素偏移?)
【发布时间】:2016-10-07 10:32:30
【问题描述】:
目前,我正在开发一个网站,希望将信息窗口放置在标记下方。
默认情况下,当您拥有地图并单击标记时,信息窗口将显示在该标记上方,箭头指向该标记。我想换一个。
在google maps api 中有一个关于pixelOffset 的部分可能会起作用,但我就是不明白。
这个像素偏移,哪里会完全为0?如果你缩小怎么办。
我似乎无法弄清楚这个 pixelOffset 是如何工作的,如果它真的是我需要将信息窗口放在标记下方的东西。
所以我的问题一般是:有人知道如何将谷歌地图信息窗口放在标记下方吗?我需要 pixelOffset 还是这完全不同?
谢谢!
【问题讨论】:
标签:
javascript
google-maps
google-maps-api-3
marker
infowindow
【解决方案1】:
可以使用pixelOffset 属性调整偏移量,但我认为这不是您想要的,因为箭头始终指向下方,而不是向上指向标记。
您想要的是对 infowindow 的更多控制,而使用 google.maps.InfoWindow 类是无法实现的。有一个名为 InfoBox 的库,它支持与 infowindow 相同的功能,但具有更多功能,可以更好地进行自定义。
检查this tutorial,作者正在演示与您想要实现的功能非常相似的功能。基本上,您将为信息信息窗口创建自己的结构,包括自己的箭头。只需使用 HTML 和 CSS。教程中的更多内容。
还有一件事,博文上infobox库的链接坏了,因为最近移到github了,你可以找到here。从那里将其下载到您的项目中(infobox.js 或 infobox_packed.js,这是缩小版)。