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

Question

这是this问题的后续行动。

我需要创建一个具有以下约束的Horizo​​ntal Brush：

1. 仅允许在右侧调整画笔大小
2. 这意味着禁用移动并从左侧调整大小
3. 点击selection会触发单独的操作，而不会触发默认的move操作

我可以使用那里的解决方案实现＃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。

我的另一个答案已经解决了禁用默认移动行为的问题，因此这只会添加一个新的处理函数作为您自己代码的挂钩。