Question

我有一个带有数百个节点和链接的强制有向图，但窗口太小，无法显示所有节点（链接）。我必须在Chrome浏览器中向下或向上滚动才能看到所有数据。下面是我的窗口代码，如何缩放所有数据以适应当前窗口

        var width = 2400;
        var height = 1500;
        var color = d3.scale.category20c();

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

Answer 1

虽然建议不要主动调整用户窗口的大小，但可以使用vanilla JavaScript来实现：

window.resizeTo(width, height);

容纳节点的更好方法是使包含div元素的svg可滚动（尝试将style属性放入单独的CSS文件中）：

<div style="overflow:scroll;">
    <svg><!-- your contents --></svg>
</div>

或

根据当前窗口的大小调整svg及其所有元素（例如您的节点）的大小。那将是另一个故事。

d3.js窗口缩放

1 个答案: