JavaScript InfoVis SpaceTree : prevent the selected node centering on the canvass

Question

我正在使用 Javascript InfoVis SpaceTree。我有一棵如下所示的树:

但是我想选择“现在”节点，以便它突出显示返回根节点的路径，但防止该节点居中。即:

我试过了 setPos()但这不起作用。

有什么想法吗？

这是一个 github 存储库，其中包含完整的独立源代码副本(遗憾的是，自从我最初提出这个问题后，我的网站就消失了):

https://github.com/kevinkenny/so4418163

在示例中，文件 ex2.html 包含生成第一张图像的标记，ex3.html 包含呈现底部图像的标记。

Answer 1

啊，这又把 Graph 库搞砸了 :D

让我们再看看那个选择函数，特别是 onComplete 回调:

onComplete: function(){ // what a mess!
    group.hide(group.prepare(getNodesToHide.call(that)), complete); // hide the nodes???
    geom.setRightLevelToShow(node, canvas); // guess what this already moves stuff around!
    that.compute("current"); // recomputes the graphs position
    that.graph.eachNode(function(n) { // sets up the moved node positions
        var pos = n.pos.getc(true);
        n.startPos.setc(pos.x, pos.y);
        n.endPos.setc(pos.x, pos.y);
        n.visited = false; 
    });

    // hey look! We don't use a global translation offset! So we need to translate the HTML stuff extra
    var offset = { x: complete.offsetX, y: complete.offsetY };
    that.geom.translate(node.endPos.add(offset).$scale(-1), ["start", "current", "end"]);

    // show the nodes again?
    group.show(getNodesToShow.call(that));              

    // the first useful call in here, redraw the updated graph!
    that.plot();
    complete.onAfterCompute(that.clickedNode); // callback better leave them here
    complete.onComplete();
}

既然你根本不想重新定位，我们可以重构(也称为删除一些行)它:

onComplete: function(){             
    that.plot();
    complete.onAfterCompute(that.clickedNode);
    complete.onComplete();
}

看妈妈!我节省了大量字节!!!这就是所有需要的休息，不会对图表做任何重要的事情。

当然，只是摆脱功能可能有一天会反咬你一口，所以我们应该向 select 添加一个 center 参数:

select: function(id, center, onComplete) {

....

onComplete: function(){
    if (center) {
        group.hide(group.prepare(getNodesToHide.call(that)), complete);
        geom.setRightLevelToShow(node, canvas);
        that.compute("current");
        that.graph.eachNode(function(n) { 
            var pos = n.pos.getc(true);
            n.startPos.setc(pos.x, pos.y);
            n.endPos.setc(pos.x, pos.y);
            n.visited = false; 
        });
        var offset = { x: complete.offsetX, y: complete.offsetY };
        that.geom.translate(node.endPos.add(offset).$scale(-1), ["start", "current", "end"]);
    }
    group.show(getNodesToShow.call(that));              
    that.plot();
    complete.onAfterCompute(that.clickedNode);
    complete.onComplete();
}