如何将 d3 地图工具提示绑定到 Leaflet 的 popupPane？答案

【问题标题】：How can I bind d3 map tooltips to Leaflet's popupPane?如何将 d3 地图工具提示绑定到 Leaflet 的 popupPane？
【发布时间】：2014-02-02 19:21:24
【问题描述】：

我对@987654321@ 进行了改编，将几个地图层叠加在一起：

问题在于悬停工具提示 - 绑定到 D3 多边形的鼠标悬停 - 显示在参考图块的下方：

我尝试更改 the hover tooltip element 的 z-index，但这些元素有点被困在各自的窗格中。如何将 D3 生成的弹出窗口绑定到传单popup pane？

谢谢！

【问题讨论】：

SVG 中没有z-index —— 元素按照它们出现的顺序呈现。所以如果你想让一个元素出现在顶部，你必须确保它在 DOM 中排在最后。
这就解释了为什么这不起作用；但我的问题正是：我怎样才能最后添加元素（即在顶部窗格图块之后）？
在添加这些图块的代码之后运行该代码。很抱歉没有更具体，但您的应用程序相当大。
非常抱歉；我责怪骨干 :) 但是元素已经 appended to the SVG 在瓷砖是 added to the top pane 之后。
.leaflet-top-pane {pointer-events: none;} 救了我。当顶部有一个标签窗格时，我需要在我的 D3 窗格上保持交互，这起到了作用。欢呼

【解决方案1】：

似乎唯一的方法是为工具提示创建另一个窗格（第 4 层）并破解 d3 工具提示代码以在该窗格中添加元素。

【讨论】：

开始破解。不幸的是，crosslet 目前使用的是backbone.js，因为它的编织方式让我很难梳理出窗格附件。
Hey Mourner - 有没有人将 leaflet 弹出窗口附加到不同窗格的示例？在参考叠加层下方使用传单矢量图层时，我遇到了与上述相同的问题；弹出窗口出现在街道下方。