Eu tenho um gráfico usando layout de força, mas tem uma largura fixaw e alturah:

var svg = d3.select("#viz").append("svg")
            .attr("id", "playgraph")
            .attr("width", w)
            .attr("height", h)

var force = d3.layout.force()
              .nodes(nodes)
              .links(links)
              .charge(-1600)
              .linkDistance(45)
              .size([w, h]); 

o que resulta em um gráfico svg que não é dimensionado ou diminuído apesar das alterações na tela ou no tamanho da janela do navegador. Para torná-lo responsivo (ou seja, redimensiona-se automaticamente), tentei usarviewBox epreserveAspectRatio atributos:

var svg = d3.select("#viz").append("svg")
            .attr("id", "playgraph")
            .attr("width", w)
            .attr("height", h)
            .attr("viewBox", "0, 0, 600, 400")
            .attr("preserveAspectRatio", "xMidYMid meet");

Infelizmente, isso não funcionou, pois nada acontece quando eu ajustei o tamanho da janela do navegador. Eu me pergunto se o.size([w, h]) do gráfico de força tem algo a ver com isso.

Por favor, lance alguma luz sobre como usarviewBox epreserveAspectRatio atributos com gráficos de layout de força.