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