D3js重叠元素:如何“穿过”点击“下”键;元素

d3js overlapping elements: how to "pass through" clicks to "lower" element?

本文关键字：元素 点击 重叠 如何 D3js 穿过      更新时间：2023-09-26

使用d3js，我在另一个元素之后/之上绘制了一些元素。如:

 // draw rectangle from dataset "d"
 svg.selectAll(".rect").append("rect")
            .attr("y", 10)
            .attr("x", 10)
            .attr("height", 5)
            .attr("width", 5)
            .on("click", function (d, i) {  
        // react on clicking
     });
  // slightly bigger frame overlapping first one
  var c=1.02;
  svg.append("rect")
                .attr("x", 10)
                .attr("y", 10)
                .attr("width", 5 * c)
                .attr("height", 5 * c)
                .attr("stroke", "blue")
                .attr("stroke-width", 1)
                .attr("fill-opacity", 0)

显然，当第二个元素与第一个元素重叠时，它会阻塞鼠标事件。我想绕过点击，双击和右键点击透明地通过第二个对象。我怎么能做到呢?

最简单的方法是设置对象不接收指针事件:

svg.append("rect").attr("pointer-events", "none");
相关文章：