谷歌地图 v3 中 Infobubble 上的标记答案

【问题标题】：Marker over Infobubble in google maps v3谷歌地图 v3 中 Infobubble 上的标记
【发布时间】：2014-10-14 16:55:01
【问题描述】：

我正在尝试将 google.maps.Marker 对象放在（z-index 定位）Infobubble 对象上

但我没有成功。基本上我正在做的是将 zIndex: n 分配给 markerOptions 对象，我将其传递给 Marker 构造函数，如下所示：

var markerOptions = {
    position: store.getLocation(),
    title: store.getDetails().title,
    icon: DEFAULT_MARKER,
    anchorPoint: new google.maps.Point(20,5),
    zIndex: 2
};
var marker = new google.maps.Marker(markerOptions);

我已经阅读了这个答案Google Maps v3 marker over infowindow，但实际上它没有得到任何投票。谁能告诉我更多信息？

非常感谢

【问题讨论】：

是的，这是不可能的，我很确定是问题所在。谷歌地图具有预先确定的特定图层，用于绘制地图本身的位置、绘制文本覆盖的位置、绘制道路的位置、绘制形状/多边形的位置、绘制交通的位置、绘制信息窗口的位置，等等所以基本上这些都在一个集合中，你不能改变它，你必须制作自定义覆盖并将它们自己堆叠我认为（这可能已经改变但最后我使用它你无法修改内置的覆盖顺序）。
感谢您回答 shaunhusain。非常好的解释，我真的很感激。似乎实现我想要的结果的独特方法是将我的标记层注入到 infobubbles 层中，以使 z-indexes 在它们之间可见。我会尝试一下

标签： javascript angularjs google-maps google-maps-api-3

【解决方案1】：

正如 shaunhusain 所评论的那样，问题在于将绘制特定元素的固定窗格。

您需要使用自定义叠加层是正确的，但您必须使用它来绘制标记，而不是信息气泡。

原因：infobubble 是一个custom overlay 的实现，它会被绘制在floatPane 里面。要将标记放在顶部，必须将信息气泡绘制到 zIndex 等于或低于将绘制标记的窗格的 zIndex 的窗格中。但是问题来了：所有这些窗格都不会接收鼠标事件，您将无法与信息气泡交互（选择选项卡、选择文本、单击链接、关闭信息气泡）。

因此必须使用自定义叠加层来绘制标记，并且必须将这些叠加层放入floatPane（它是zIndex 最高的窗格）

【讨论】：

感谢莫勒博士的解释。另外，感谢您提出的解决方案。我会在几天内深入研究这个问题，我最终会发布其他问题。