Mam wykres wykorzystujący układ sił, ale ma on stałą szerokośćw i wysokośćh:

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]); 

co powoduje, że wykres svg nie jest skalowany ani obniżany pomimo zmian w ekranie lub rozmiarze okna przeglądarki. Aby sprawić, by był responsywny (tj. Automatycznie zmieniał rozmiar), próbowałem użyćviewBox ipreserveAspectRatio atrybuty:

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");

Niestety to nie zadziałało, ponieważ nic się nie dzieje, gdy dostosowuję rozmiar okna przeglądarki. Zastanawiam się, czy.size([w, h]) wykres siły ma z tym coś wspólnego.

Proszę rzucić trochę światła na sposób użyciaviewBox ipreserveAspectRatio atrybuty z wykresami układu sił.