D3JS强制布局中心图像

Question

我在d3js中使用强制布局来绘制网络图 问题是我的SVG被截断了（请参见下面的图片） 如何获得整体形象？ 我正在用它来初始化图表：

var width = 1200,
        height = 1000,
        root;

    var force = d3.layout.force()
        .size([width, height])
        .on("tick", tick)
        .start();

    var svg = d3.select("body").append("svg")
        .attr("width", width)
        .attr("height", height);

    var link = svg.selectAll(".link"),
        node = svg.selectAll(".node");

Answer 1

首先建议我只是简单地缩放视口...

var svg = d3.select("body").append("svg")
        .attr("width", width)
        .attr("height", height);
        .attr("viewBox", `${-width/2} ${-height/2} ${width*2} ${height*2}`)

或者您可以计算所有节点的bbox并设置更精确的视图框