D3改变单个节点的费用

FMa*_*008 11 d3.js force-layout

当我点击一个节点时,我的节点变大了,而现在它变得更大了,我希望他能够更多地排斥其他节点.如何更改节点的费用?

代码摘录:

[...]

//draw new graph
d3.json(file, function(error, graph) {

force
.nodes(graph.nodes)
.links(graph.links)
.start();

var nodeCircle = node.append("circle")
.attr("id", function(d) { return "node"+d.id })
.attr("class", function(d) {return "node "+d.nodeclass; })
.attr("r", 8) // R = Radius of node
.style("fill", function(d) { return d.color; }) // Will overwrite CSS style
.on("click",function(d) {

    //When CTRL key is pressed ....
    if (d3.event.ctrlKey) {
        if(d3.select(this).attr('r')==8){
            d3.select(this).attr('r', 12);
            //ToDo: node Charge = -1000
        }else{
            d3.select(this).attr('r', 8);
            //ToDo: node Charge = -500
        }
    }

}).call(force.drag);
[...]
Run Code Online (Sandbox Code Playgroud)

小智 8

function click(d1,i){
    force.charge(
            function(d2,i){
                if(d2!=d1)
                    return ...;//calculate your charge for other nodes
                else
                    return ...;//calculate your charge for the clicked node
            });

        force.start();
 }
Run Code Online (Sandbox Code Playgroud)

这对我来说很好!! 如我错了请纠正我..!


Lar*_*off 5

文档:

force.charge([电荷])

如果指定了电荷,则将充电强度设置为指定值.如果未指定充电,则返回当前充电强度,默认为-30.如果电荷是常数,则所有节点具有相同的电荷.否则,如果charge是一个函数,则为每个节点(按顺序)计算函数,传递节点及其索引,并将此上下文作为强制布局; 然后,函数的返回值用于设置每个节点的费用.无论何时布局开始,都会评估该函数.

所以你需要做的是指定一个函数,charge()为相关节点提供不同的费用并再次启动布局.

  • 我已经读过了,但是文档没有提供任何代码示例,到目前为止我在上面的上下文中实现它的所有尝试都失败了.force.charge()没有明确说明如何从节点访问force()函数...至少对我而言.我知道解决方案很简单,我找不到它:p (2认同)