d3拖动行为：在拖动名称空间中注册，监听和触发不同类型？

Question

输入d3.behavior.drag()让我感到困惑。 我想指定拖动类型，以便不同的对象触发不同的拖动事件。 我习惯使用D3调度/命名空间进行以下操作：

1. 向D3分发对象注册它们
2. 然后使用类似.on('click.typeHere')来监听调度事件
3. 并使用dispatch.typeHere(<<data>>)触发事件。

我不知道正常的分派过程如何应用于拖动行为。 例如：

 var svg = d3.select('svg').append('g') .attr('transform','translate(0,20)'); svg.append('rect') .attr('height', 50) .attr('width', 20) .style('fill', 'steelblue'); var drag = d3.behavior.drag(); drag.on('drag', function() { console.log('drag'); }).on('drag.type', function() { console.log('namespace active'); }).on('drag.type2', function() { console.log('namespace2 active'); }); svg.append('circle') .attr('cx',20) .attr('cy',0) .attr('r',10) .style('fill', 'orange') .call(drag); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script> <svg></svg> 

我希望圆圈在drag.type时仅触发drag.type ，而不触发在拖动行为名称空间中注册的其他拖动。 但是不支持.call(drag.type) 。 解决这个问题的正确方法是什么？

Answer 1

对于不同类型的对象，我将使用不同的拖动行为，并由各自的拖动处理程序执行适当的操作。 这将使您不必去弄乱事件名称空间：

var drag1 = d3.behavior.drag()
.on('drag', function() {
  console.log('drag rect');
});

svg.append('rect').call(drag1);

var drag = d3.behavior.drag()
.on('drag', function() {
  console.log('drag circle');
});

svg.append('circle').call(drag);

在此处完成演示。