D3js v4。如何确定自定义事件？

Question

我想通过自定义“点击+删除”事件删除svg元素。我知道如何确定click事件，以及ctrlKey，shiftKey，altKey，metaKey等事件。但我想使用其他键。什么是正确的方法？

Answer 1

您需要收听两个不同的事件来实现此目的，特别是keydown和keyup事件。让我们假装我们有一个圆圈：

const DELETE_KEYCODE = 46;
let deletePressed = false;

d3.select("svg")
  .selectAll("circle")
  .on("keydown", () => { deletePressed = d3.event.keyCode === DELETE_KEYCODE; })
  .on("keyup", () => { deletePressed = false; })
  .on("click", (d, i, elements) => {
      if (deletePressed) {
         d3.select(elements[i]).remove();
      }
  });

现在实际上你可能希望keyup更加智能，以防他们按下几个键但没有keyup 删除！但我会让你解决这个问题。