У меня есть график с использованием силового макета, но он имеет фиксированную ширинуw и высота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]); 

в результате график svg не масштабируется и не уменьшается, несмотря на изменения размера экрана или окна браузера. Чтобы сделать его отзывчивым (то есть автоматически изменяет размер самого себя), я попытался использоватьviewBox а такжеpreserveAspectRatio атрибуты:

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

К сожалению, это не сработало, поскольку при настройке размера окна браузера ничего не происходит. Интересно, если.size([w, h]) графа силы имеет какое-либо отношение к этому.

Пожалуйста, пролить свет на то, как использоватьviewBox а такжеpreserveAspectRatio атрибуты с графами макетов силы.