css - 隐藏在第二张图表后面的 Highcharts 工具提示

Question

我们的页面有大量由 HighCharts 生成的水平条形图。长话短说，图表中的工具提示被下面的图表和旁边的图表覆盖了。我弄乱了 z-index，它似乎没有什么不同。我看过以前的类似问题，但没有帮助。

这是我的例子:http://jsfiddle.net/o15gywrv/5/

如果将鼠标悬停在第一个图表上，您会看到工具提示被第二个图表覆盖了。

我试过在容器和工具提示上使用 z-index，但没有发现任何区别:

.highcharts-container {
    overflow: visible !important;
    z-index: 0 !important;
}
.highcharts-tooltip {
    z-index: 9998;
}

Answer 1

对我来说，在悬停时设置简单的 css z-index 是可行的:

.highcharts-container:hover { z-index: 1 !important; }