javascript - 覆盖画笔选择的默认移动行为

Question

这是对 this 的跟进问题。

我需要创建一个具有以下约束的水平画笔:

1. 只允许在右侧调整画笔大小
2. 这意味着禁用从左侧移动和调整大小
3. 点击selection应该触发一个单独的 Action ，而不是触发默认的move Action

我能够使用那里的解决方案实现#1 和#2。这个问题用问题 #3 对此进行了扩展。

Answer 1

我会将其限制为仅回答您的第 3 项。关于处理对画笔选择的点击。扩展我的 answer 中的示例对于您的其他问题，这可以通过使用 D3 在 <rect class="selection"/> 上注册事件处理程序的方式来完成。对应选择。

g.selectAll(".selection")
  .on("mousedown touchstart", function() {
    // Add/enable second brush here.
    console.log("Selection clicked");
  }); 

看看工作demo .

我的其他答案已经涉及禁用默认移动行为，因此这只会添加一个新的处理函数作为您自己代码的 Hook 。