如何有选择地将鼠标事件传递给底层的svg元素

时间:2015-11-07 08:51:10

标签: javascript jquery css d3.js svg

我有一个散点图,其中有一个用于放大数据的画笔图层和用于鼠标悬停捕捉的voronois,但问题是voronoi路径不会让点击事件落到画笔图层或者如果将画笔保持在顶部则不会不允许悬停事件落到voronoi层

画笔图层需要点击事件

Voronoi图层需要悬停事件

我应该如何进行设置,css只有解决方案

保持画笔层位于顶部:

brush layer on top

将voronoi层保持在最顶层:

voronoi's tesselations over brush layer

1 个答案:

答案 0 :(得分:0)

我在voronoi上做了这个,将刷子保持在底部,但它在边缘闪烁

$("#visualization-main-container > svg > g.voronoiWrapper > path.voronoi-poly").css("pointer-events", "all");

setTimeout(function() {
    $("#visualization-main-container > svg > g.voronoiWrapper > path.voronoi-poly.voronoi-movie-id-" + d.id).css("pointer-events", "none");
}, 10);

编辑:

我终于使用热键“CTRL”来暂时禁用voronoi图层上的鼠标事件,它为缩放过程添加了一个额外的步骤,但它更加流畅。