使 D3.js 宽度和高度为 100%

Question

如何使 svg 具有页面的整个高度和宽度。下面的代码创建了一个宽度为 1411，高度为 150 的 svg。我知道 d3 的默认高度为 150。但是，我在代码中将其设置为 100%。如何将其设置为页面宽度和高度的 100%？

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

Answer 1

一个非常简单的方法是在添加<svg> 时直接get the window's width and height。

d3.select('body').append('svg')
  .attr('width', window.innerWidth)
  .attr('height', window.innerHeight)

但是，如果调整窗口大小，这不会自动更新。