两个“调用”来拖动d3中的事件 [英] Two 'calls' to drag events in d3

问题描述

我在d3中使用强制导向布局，我在开发中遇到了一些障碍。

I'm using the force-directed layout in d3 and I'm running into a bit of a snag in development.

    var circle = svg.append("svg:g").selectAll("circle") 
     .data(force.nodes()) 
   .enter().append("svg:circle")   
     .attr("r", function( d ) { 
      return d.fValue; 
     }) 
     .style('fill', function( d ) { 
       return strokeColor( d.name );   
     })
     .call(force.drag);

基本上，我想添加更多的事件监听器到drag.dat定义的行为force.drag - 即，我想确保节点在拖动（不是在鼠标悬停）上更改颜色。我只能想到这样做的唯一两种方法是以某种方式改变force.drag函数或定义一个新的拖动行为。

Basically, I want to add more event listeners to the 'drag' behavior defined by force.drag - namely, I want to make sure that the nodes change color on drag (not on mouseover). The only two ways that I can think of doing this is either to somehow change force.drag function OR define a new drag behavior.

我不知道该怎么做它是第一种方式，但是当我以第二种方式尝试时，方法链接只会采取第二个拖动事件，忽略第一个force.drag事件。

I don't know how to do it the first way but when I tried it this second way, the method chaining would only take the second drag event, ignoring the first force.drag event.

.call(customDrag)
.call(force.drag); // This would work

如何附加另一个拖动事件侦听器或修改现有force.drag适合我想添加的新动画？

How do I attach another drag event listener or modify the existing force.drag to accomodate for the new animation I want to add?

提前感谢

推荐答案

定义您自己的侦听器， code> force.drag 只调用 force.tick（） afaik：

Define your own listeners, as force.drag only calls force.tick() afaik:

  var node_drag = d3.behavior.drag()
        .on("dragstart", dragstart)
        .on("drag", dragmove)
        .on("dragend", dragend);
  vis.selectAll("g.node").call(node_drag)

请确保您在 dragmove 中调用 tick（）。

我这样做是为了添加拖放支持与强制布局。
查看我的stackoverflow问题&回答一个例子

I did this for adding drag and drop support with force layout. see my stackoverflow question & answer for an example

这篇关于两个“调用”来拖动d3中的事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！