1

我试图让我的 D3 网络在它达到一个不错的布局（alpha 达到 0）后冻结。我希望力完全停止，即使拖动节点（用户应该能够手动重新排列节点）。我想我知道如何通过修改节点的 mousedown 和 mouseup 调用的函数来完成第二部分。但是，我无法让原始布局和冻结工作。

我查看了“静态”强制布局的示例，其中网络仅在布局完成后显示。但是，我希望网络在达到稳定布局时显示。我将此添加到绘制网络的函数的末尾：

while (force.alpha() >0.005) {
    force.tick();
}
force.stop();

通过此添加，网络在到达force.stop(). 有谁知道如何让它在“滴答”时显示？

编辑：这是我的tick功能实现：

function tick(e) {

console.log(force.alpha());
if (force.alpha() <0.05) {
    force.stop();
}
var h = svgH;

if (e.alpha < 0.05) {
    var q = d3.geom.quadtree(nodes),
    i = 0,
    n = nodes.length;

    while (++i < n) {
        q.visit(collide(nodes[i], e.alpha));
    }
}   


path.attr("d", function(d) {

    // Total difference in x and y from source to target
    diffX = d.target.x - d.source.x;
    diffY = d.target.y - d.source.y;

    // Length of path from center of source node to center of target node
    pathLength = Math.sqrt((diffX * diffX) + (diffY * diffY));

    // x and y distances from center to outside edge of target node
    offsetX = (diffX * d.target.radius) / pathLength;
    offsetY = (diffY * d.target.radius) / pathLength;

    if (d.target.y < d.source.y) {
        var avgY = (d.target.y + d.source.y)/2;

        if (d.target.fixed != true) {
            d.target.y = avgY;
        }
        if (d.source.fixed != true) {
            d.source.y = avgY;
        }
    } 

    return "M" + d.source.x + "," + d.source.y + "L" + (d.target.x - offsetX) + "," + (d.target.y - offsetY);
});

// Keep circles within bounds of screen
var r = 6;
circle.attr("cx", function(d) { return d.x = Math.max(r + d.radius, Math.min(w - r, d.x)); })
        .attr("cy", function(d) {
            return d.y = Math.max(d.radius, Math.min(h - d.radius, d.y));
        });

        text.attr("transform", function(d) {
        return "translate(" + d.x + "," + d.y + ")";
        });
}
4

1 回答 1

0

检查tick事件处理程序中的停止条件——这样您就可以在每次滴答和停止时重绘网络。

于 2013-06-21T20:44:24.967 回答