d3 svg填充屏幕

Question

我正试图在此page上获取d3 svg可视化以填充屏幕。

我的文件中的HTML是一个空div：

<div id='d3'>
</div>

加载页面时，会填充以下内容：

<svg width="1390" height="475"><g transform="translate(55,55)"> … </g></svg>

如何预先调整此宽度和高度以使其填满页面？

Answer 1

我是D3的新手！所以无法提供更多信息..但是我发现这个JQuery Answer你可以用它来获得宽度然后插上它。

https://stackoverflow.com/a/1038765/709872

显然没有JQuery来帮助它更复杂！希望这能指出你正确的方向。

Answer 2

如果你想用svg填满屏幕，也许你可以这样做：

  var width = $(window).width();
  var height = $(window).height(); 

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