中心力导向布局后使用根节点（返回中心） [英] Center force directed layout after tick using root node (return to center)

问题描述

我正在使用D3.js尝试强制导向布局。我需要的是中心布局的根（或其他选定的节点），并返回此节点到svg（例如画布）中心后，tick函数完成（图的alpha是低）。可能吗？我在

I am experimenting with force directed layout using D3.js. What I need is center the layout by root (or other selected node) and return this node to the svg (e.g. canvas) center after the tick function is done (the graph alpha is low). Is it possible? I found an example at

http：//bl.ocks .org / 1080941

但我无法使根（在使用aplha或其他自定义tick函数计算时）返回中心布局由这个特定的节点）。

but I am unable to make the root (when using aplha or other custom tick function calculation) return back to the center (center the layout by this particular node).

任何帮助将不胜感激。

推荐答案

其实我这样解决这个问题（类似以前但更复杂）：

Actually I solved this like this(similar to previous but more sophisticated):

force.on("tick", function(e) {

     node.attr("transform", function(d) { 
         //TODO move these constants to the header section
        //center the center (root) node when graph is cooling down
        if(d.index==0){
            damper = 0.1;
            d.x = d.x + (w/2 - d.x) * (damper + 0.71) * e.alpha;
            d.y = d.y + (h/2 - d.y) * (damper + 0.71) * e.alpha;
        }
        //start is initiated when importing nodes from XML
        if(d.start === true){
            d.x = w/2;
            d.y = h/2;
            d.start = false;
        }

        r = d.name.length;
        //these setting are used for bounding box, see [http://blockses.appspot.com/1129492][1]
        d.x = Math.max(r, Math.min(w - r, d.x));
        d.y = Math.max(r, Math.min(h - r, d.y));

            return "translate("+d.x+","+d.y+")";            

     }
    );

     });   

这篇关于中心力导向布局后使用根节点（返回中心）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！