c3js：自定义区域工具提示，悬停效果等

Question

我一直在用c3js创建一个指标模块（使用时间序列）。我现在试图在我的指标数据上绘制事件，这些数据是日期跨度（startDate到endDate）。使用c3js＆＃39;区域似乎是一个很好的选择，只需要稍微修改一下，使它们缩短并显示在我绘制的所有数据之上。

问题是，名为g.c3-regions的实际SVG组会自动显示在图形数据后面。有道理，没有任何真正需要允许任何用户与地区互动。我需要它在最前面，所以我可以将hover和click函数绑定到每个事件。

我尝试使用jQuery执行此操作：$('.c3-regions').insertAfter('.c3-chart')，它只是将它放在前面。工作正常 - 也就是说，直到我的c3js实例重新渲染。然后它会发出一个错误，表示它无法重新渲染区域（因为它们显然已移动）

我还尝试克隆它并把它放在前面，但它似乎并没有复制SVG信息。

任何帮助都会非常感激，可以根据要求提供任何代码示例。

干杯 - 安德鲁

Answer 1

要扩展Robert Longson的评论，您要添加的内容是

.c3-event-rect {
    pointer-events: none;
}

.c3-chart {
    pointer-events: none;
}

这将允许点击进入区域图层。